《js语法、语义函数》由会员分享，可在线阅读，更多相关《js语法、语义函数（32页珍藏版）》请在金锄头文库上搜索。
1、语法和语义可选的分号标识符(Identifier)基础数据类型和字面量(Literal)变量的作用域关于 =, !=, =, !=关于 this, new, apply, call关于 arguments成员访问, prototype 链, 继承变量访问, call object, Closure总结惯用法和技巧编码规范和 JS 书写模板页面功能的普通功能模块需要提供给其他模块使用(单例)模块需要提供给其他模块使用(多实例)为继承而设计的类继承其他类BOM 和 DOM 简介BOMDOMjQuery 学习设计理念Utility选择 与 CSS3选择器构造 jQuery 对象jquery 对象结构
2、基本操作事件操作数据检测前端基础库 fdevlibstyle 目录结构简要说明fdev-v4现有组件JS 学习本文目的在于为 Java 或有语言基础的同学参于前端开发提供指导语法和语义可选的分号语句如果它们在单独一行，那么结尾的分号可以省略。注：为了一致性和避免错误(如压缩或 merge 带来的错误)，我们要求所有语句都要加分号（块语句和函数申明语句后不需要分号）var a = 1;a += 1;var callback = function() return hi;/ 函数申明语句function other() for (var i = 0; i undefined标识符(Identifi
3、er)和 Java 相比，Javascript 允许在标识符中使用$，所以很多库都用它来定义特殊作用的全局对象像 jQuery, Prototype, Mootools 等框架使用$操作页面节点, 它仅是一个普通的函数/ 在 jQuery 中$(#mydiv a).css(color, #f00); / 设置链接颜色/ 在旧版本的 Mootools 中if ($type(abc) = string) / 新版本使用 typeOf 代替/ 在中文站 JS 基础库 FDEV3中var elm = $(mydiv); / 相当于 document.getElementById(mydiv);所以$可
4、以用作有特殊 含义的变量名/ 在有些同学的代码中, 用于在内部函数中访问外围对象var Test = hi: function() var $this = this; / 我见过的常用的名称还有 that, self, me 等,/ 使用 self 有一个隐患，就是忘记了定义 self 时，/ 会造成难以排错，因为有一个全局的 self 会产生干忧$.ajax(url, success: function(o) o.success & $this.render(o.data);,render: function() ;基础数据类型和字面量(Literal) Number123, 0xf000,
5、 0377(8进制）3.14, .222, 1.2e12, 1.4e-12可以使用 Math 对象进行常见的科学计算，见 http:/ Javascript 也定义了一些特殊的 Number 用于合适的需要, 如 NaN, Number.MAX_VALUE, Number.MIN_VALUE，参考Javascript 权威指页3.1.6注：当使用 parseInt 将字符串转成整型时, 请带上进制 , 否则如果有前缀是0，会被当成8进制处理可能不符合预期需求var num = parseInt(inputText, 10); / 如在文本框输入页码等String可以使用单引号或双引号两种形式v
6、ar str1 = 我是一个字符串，包含着双引号; / 单引号中的双引号可以不用转义，当然使用转义也木有问题var str2 = 我是另一个字符串, 包含着单引号;var template =示例1;String 和 Number 的转化技巧parseInt(123, 10); / 注: 请加上第二个参数123 - 0 / 注： 不能使用 +456 + 123456 + 元 / - 123456元;String 对象的方法请参考http:/ null, undefined, 0, NaN, 在逻辑判断中都被当成 false 处理var keyword = $(#keyword).val();i
7、f (!$.trim(keyword) / 用户输入为空var num = $(#num).val();num = parseInt(num, 10);if (!num) / NaN/ 用户输入非法数字Function/ 申明式 function a() console.debug(a.name) / - a/ 匿名函数var b = function() ;console.debug(b.name) / - 申明式和语句式区别fun(123); / 在这里就可以使用function fun(value) console.debug(value);b(123); / b is undefine
8、d;var b = function() ;Object Literalvar album = name: pipixiuxiu, / 注，这里的 name 不是变量, 只是省略了单引号count: 100,private: true, / 当属性名称是保留字时，必须使用这种方式234: 较少用,12.34: 更少用;album.name;albumcount;album234;jQuery 对象是怎么造就的?var o = 0: elm0,1: elm1,2: elm2,3: elm3,length: 4,splice: function() / firebug 看到这个会以为它是个数组，所
9、以显示方式和数组一样.注:使用 Literal 语法构造对象,而不是 new Object()var o = ; / 而不是 new Object();Array Literalvar ary = ;ary0 = one; var list = 99, some string, function() ;Array 的方法请参考http:/ Literal 语法构造数组,而不是使用 new Array() *var array = ; / 而不是 new Array();拼接字符串, 在 Java 中使用 StringBuilder 或 StringBuffer 拼接字符串，以减少临时对象的产生
10、提高 GC 效率。在 JS 中使用数据组达到这一目的。var html = ;elms.each(function() html.push(some string .););html = html.join();注 在 Object/Array 最后一个元素后面不能加逗号，尽管这在标准上允许，但是在 IE6 7 浏览器下会报语法错误所以，如果发现在 FF 下工作正常，在 IE 下工作不正常，请检查是否 object 或 array 最后多了个逗号var o = name: pipi,desc: er er er,/ price: 12 / 在调试中把这句注释了，造成上面一句最后多了个逗号;所以
11、可能在某些代码中发现以下写法以避免上述错误var o = name: pipi,desc: er er er,/ price: 12,_: 0 / 多了一个这样的元素;不过我不推荐这样的形式，注意点就好，因为上述形式可能会带来其他隐患，并且可读性也不好。可以借助工具来扫描这类错误,如 JSLint: http:/ JS 中是函数作用域的，而不是块作用域(C, Java, C#等是块作用域）function hello() var a = 123;for (var i = 0; i 234在函数作用域内定义的 var 都相当于在一开始定义一样 即一个函数执行时，引擎分两步操作1. 处理所有 va
12、r 语句(和函数申明语句 ), 准备好执行环境, 相当于这些 var 和 function 申明语句写在函数的最前面2. 执行函数内的语句所以上述代码相当于这样：function hello() var a,i;a = 123;for (i = 0; i 234这会让 javascript 虚拟机实现 closure 更方便，让内存模型更简洁function hello() alert(a); / alert(undefined);if (false) var a;等效于function hello() var a;alert(a);if (false) function hello() al
13、ert(a); / ReferenceError: a is not defined最佳实践一个函数内最好只有一个 var, 并且尽可能靠前(最好是在函数一开始) 但这与块作用域的实践, 变量最好在用到的时候定义不一致所以函数尽可能得短小, 以满足前面两个条件关于 =, !=, =, !=一句话: 总是使用 = 和 !=进行比较因为 = 和 != 在比较时如有必要，会进行类型转换null = undefined / - true0 = false / - true1 = true / - truenull = false / - falseundefined = false / - false
14、 具体的比较规则请参考 ECMA262 11.9.3如果不想看,可能参考一条规则:null = undefined, 字符串和 boolean 都转成数字进行比较关于 this, new, apply, call当调用一个方法(函数时),函数内部的 this 指向一个对象, 在规范中被称为: ThisBinding, 我喜欢叫它 BindObject一般情况下, this 指向调用它的那个对象或者 GlobalObject, 在浏览器中为 windowvar A = hello: function() console.debug(this);A.hello(); / - Avar b = A.hello;b(); /- Global Object, 在浏览器中即是 window所以函数中的 this 指向和如何调用它有关系，和在哪里定义这个函数关系不大我们可以使用 call 或 apply 方法参数化 thisvar A = name: A,function hello() console.debug(this.anme);A.hello(); / this = Avar B = name: B ;A.hello.call(B); / this = B至于 cal
