奇舞js笔记——第2课——代码风格

注:



1.学习视频地址

2.ppt地址

3.个人感想:

  是我hin厉害的师父推荐我看的月影大大的视频,感觉对于我这个小白来说,真的是一遍又一遍的刷新知识面。我觉得像月影大大这种大佬的思路,我接触之后真的是受益匪浅。

  所以我总结出来不仅是自己记笔记,也是想分享给想要成为真正的前端“工程师”的前端er。

  真的很珍惜这种知识面被刷新的感觉——越学习,越感到自己无知,共勉。

目录



1.代码风格存在的意义

2.代码风格是什么

3.遵守怎样的代码风格

4.怎样学习代码风格

5.一些特殊的代码风格:IIFE,依赖注入,模块,严格模式

6.代码风格检查工具

7.课后作业

正文


1.代码风格存在的意义

(之所以用语言而不是汇编语言或者010101,就是为了让人能看懂)

2.代码风格是什么

代码的格式(包括缩进、大括号、分号、换行、空行、空格)

广义的:

  目录结构 & 文件名

  变量命名

  文档规范

3.遵守怎样的代码风格:

(重要的是一个团队或项目,有一致性,一起遵守一样的代码风格)

常见的规范:

1.两个空格作为缩进(不一定必须)

2.字符串用单引号(因为html属性名要双引号)(要得)

3.不要不使用的变量(要得)

4.不写分号(这个看喜好吧)

5.不要以([`开头(影响iife立即执行函数)

6.关键词后有空格:if () {...}(不一定必须)

7.函数名与参数之间空格:function name (...){...}(不一定必须)

8.用===代替==,除了判断一个对象==null时(因为是弱类型,两个等号可能会强制隐式类型转换)

9.在nodejs中错误处理err要处理参数

10.把global对象的前缀window写出来,除了window.document和window.navigator可以省略window

4.怎样学代码风格

学习代码风格的最好方式是读代码

可以上github看最常用的风格(

  比如很多项目有分号,

  很多左大括号写在同一行,

  /**总注释或者函数前面用

  *这种

  *风格

  */,

  其他用行注释//,

5.一些特殊的JS风格

IIFE(Immediately-Invoked Function Expression)

IIFE与依赖注入

有的匿名函数是有参数的

有的匿名函数参数是空的

参数为空:

创造了函数级作用域,确保我在这个function之间声明的变量只有在这个函数体里能访问到,避免有人在外部访问我的变量

有参数:(依赖注入规范

可以把global,jquery,document当参数传进去,把我左右的在这个模块要用到的东西显式的通过参数暴露出来,不随意使用作用域外的东西

AMD模块管理 规范

例如require.js模块管理工具

SystemJS模块管理 规范

严格模式(use strict)

6.代码风格检查工具

ESLint/JSLint/JSHint

standard

semistandard

(后两个基于ESLint)

(编辑器sublime等等都有这些工具的插件)

(git 里可以用一个模块,在提交代码之前进行代码检查)

7.课后作业

GitHub 上找几个不同的项目,观察它们的代码风格,写一篇短文,介绍它们并谈谈你喜欢哪一种代码风格,为什么?

模仿 NPM 模块,自己写一个简单的 JavaScript 功能模块,用上自己喜欢的风格,提交到 GitHub。

对自己写的模块应用上代码风格检查工具,可以选择 ESLint、Standard 或其它代码检查工具。

时间: 2024-10-25 20:22:35

奇舞js笔记——第2课——代码风格的相关文章

奇舞js笔记——第1课——js概述(八卦)

注: 1.学习视频地址 2.ppt地址 3.个人感想: 是我hin厉害的师父推荐我看的月影大大的视频,感觉对于我这个小白来说,真的是一遍又一遍的刷新知识面.我觉得像月影大大这种大佬的思路,我接触之后真的是受益匪浅. 所以我总结出来不仅是自己记笔记,也是想分享给想要成为真正的前端“工程师”的前端er. 真的很珍惜这种知识面被刷新的感觉——越学习,越感到自己无知,共勉. 目录 1.js简史 2.js特点 3.js做什么 4.js系语言 5.谁在用js 6.奇舞课程主要内容 7.奇舞课程不讲的内容 8

奇舞js笔记——第0课——如何写好原生js代码

摘要 1.好的代码职责要清晰,javscript不要用来操作样式: 2.API要设计的合理:通用性,适度的抽象(数据抽象,过程抽象),可扩展性: 3.效率问题:用好的.合适的算法(前端程序员要把自己当程序员). 注: 1.学习视频地址 2.ppt地址 3.个人感想: 是我hin厉害的师父推荐我看的月影大大的视频,感觉对于我这个小白来说,真的是一遍又一遍的刷新知识面.我觉得像月影大大这种大佬的思路,我接触之后真的是受益匪浅. 所以我总结出来不仅是自己记笔记,也是想分享给想要成为真正的前端“工程师”

奇舞js笔记——*——过程抽象,高阶函数,面向函数编程

注: 1.学习视频地址 2.ppt地址 3.个人感想: 是我hin厉害的师父推荐我看的月影大大的视频,感觉对于我这个小白来说,真的是一遍又一遍的刷新知识面.我觉得像月影大大这种大佬的思路,我接触之后真的是受益匪浅. 所以我总结出来不仅是自己记笔记,也是想分享给想要成为真正的前端“工程师”的前端er. 真的很珍惜这种知识面被刷新的感觉——越学习,越感到自己无知,共勉. 摘要 1.数据抽象是针对数据处理的: 2.过程抽象(例如高阶函数)是针对函数处理的: 3.用高阶函数可以对已有API的接口进行修改

CoolBlog开发笔记第4课:数据库模型设计

教程目录 1.1 CoolBlog开发笔记第1课:项目分析 1.2 CoolBlog开发笔记第2课:搭建开发环境 1.3 CoolBlog开发笔记第3课:创建Django应用 前言 我新书<Python爬虫开发与项目实战>出版了. 这本书包括基础篇,中级篇和深入篇三个部分,不仅适合零基础的朋友入门,也适合有一定基础的爬虫爱好者进阶,如果你不会分布式爬虫,不会千万级数据的去重,不会怎么突破反爬虫,不会分析js的加密,这本书会给你惊喜.如果大家对这本书感兴趣的话,可以看一下 试读样章.废话少说,开

Node.js笔记(0003)---Express框架Router模块学习笔记

这段时间一直有在看Express框架的API,最近刚看到Router,以下是我认为需要注意的地方: Router模块中有一个param方法,刚开始看得有点模糊,官网大概是这么描述的: Map logic to route parameters. 大概意思就是路由参数的映射逻辑 这个可能一时半会也不明白其作用,尤其是不知道get和param的执行顺序 再看看源码里面的介绍: Map the given param placeholder `name`(s) to the given callbac

node.js笔记——模块的开发

模块是什么? 简单来说模块是用来将实现某个功能的代码进行封装以便在其他项目中通过简单引入的方式实现模块中封装的功能的一个东西!!(我更想管他叫小程序). 模块的引入 模块的引入使用reqiure()函数来实现例如引入http模块 var h = require("http"); 这里需要注意的是require()加载函数可以加载指定的js文件,当引入的不是某个js文件而是一段没有扩展名的字符时,默认node.js会加载当前根目录下的node_modules文件夹下面的文件夹里的文件 并

IOS学习之斯坦福大学IOS开发课程笔记(第六课)

转载请注明出处 http://blog.csdn.net/pony_maggie/article/details/28398697 作者:小马 这节课主要讲述多个MVC是如何协同工作的.到目前为止,所有的课程都只是涉及到一个视图.从这节课开始,将会持到多视图应用的例子. 多视图开发这里用navigationController举例子.这个也是比较常用的.如上图所示,一个 navigation Controller(MVC)会指向一个rootViewController(另一个MVC),这个是第一

Node.js笔记(0001)---connect模块

首先来看这一部分代码 1 /** 2 * Created by bsn on 14-7-1. 3 */ 4 var connect = require('connect'); 5 6 var app = connect(); 7 function hello(req, res, next) { 8 console.log(req.url); 9 res.end('hello bsn'); 10 next(); 11 } 12 13 function helloAgain(req, res) {

斯坦福大学IOS开发课程笔记(第七课第二部分)

转载请注明出处 http://blog.csdn.net/pony_maggie/article/details/32163347 作者:小马 本篇是demo演示,程序其实就是上节课的心理学家那个demo, 不过在这个demo的基础上,把它作成一个通用版,可以自动识别当前运行的设备是iphone还是ipad,然后有不同的显示效果.所以,还是打开原来的Psychologist工程,在开始之前,我会用第五课讲的自动布局知识,让视图能在横屏模式下也可以正常显示.这一部分不细讲,参考第五课. 下面就可以