1、for(var i = 0, max = myArray.length; i < max ; i++){

//用myArrayy[i]来做点什么

}

用max存储myArray的长度,防止每次循环去读取数组长度,尤其是当设计到DOM节点集合时,可明显提高效率。(2016-08-22)

2、function foo(){

var a = b = 0;

}

b会声明为全局变量。原因是:从右到左的赋值过程,首先是 b = 0 ,此情况下b是未声明的,然后是 var a  = b;实际顺序为 var  a = ( b = 0);(2016-08-22)

3、switch模式(switch Pattern)

可以通过类似下面形式的switch语句增强可读性和健壮性:

var inspect_me = 0,

result = '';

switch(inspect_me){

case 0:

result = 'zero';

break;

case 1:

result = 'one';

beak;

default:

result = 'unknown';

}

4、适合使用空格的地方包括:

-> for循环分号分开后的部分:如for(var i = 0; i < 10; i++){...}

-> for循环中初始化的多变量(i和max): for(var i = 0, max = 10; i < max; i++){...}

-> 分隔数组项的逗号的后面: var a = [1, 2, 3];

-> 对象属性逗号的后面以及分隔属性名和属性值的冒号的后面: var o = {a: 1, b: 2};

-> 限定函数参数: myFunction(a, b, c)

-> 函数声明的花括号的前面: function myFunc() {...}

-> 匿名函数包大师function的后面:var myFunc = function () {};

5、JS 表达式和声明存在着十分微妙的差别。首先,函数声明会在任何表达式被解析 和求值之前 先被解析和求值,即使你的声明在代码的最后一行,它也会在同作用域内第一个表达式之前被解析/求值,参考如下例子,函数fn是在alter之后声明的,但是在alert执行的时候,fn已经有定义了:

alert(fn());

function fn(){

return 'Hello World ...';

}

6、var f = function foo(){
          return typeof foo; // foo是在内部作用域内有效
}

//foo 在外部作用域是不可见的

typeof foo ; // "undefined"

f();// "function"

7、Module模式的基本特征:

-> 模块化,可重用;

-> 封装了变量和function,和全局的namespace不接触,松耦合

-> 只暴露可用public方法,其它是由方法全部隐藏

var Calculator = function(eq){

//这里可以声明是由成员

var eqCt1 = document.getElementById(eq);

return {

//暴露公开的成员

add: function(x, y){

var val = x + y;

      eqCtl.innerHTML = val;

}

}

}

我们可以通过如下的方式来调用:

var calvulator = new Clculator('eq');

calculator.add(2,2);

8、引用全局变量

JavaScript有一个特性叫做隐式全局变量,不管一个变量有没有用过,JavaScript解释器反向遍历作用域链来查找整个变量的var声明,如果没有找到var,解释器则假定该变量是全局变量,如果该变量用于了赋值操作的话,之前如果不存在的话,解释器则会自动创建它,这就是说在匿名闭包里使用或创建全局变量非常容易,不过比较困难的是,代码比较难管理,尤其是阅读代码的人看着很多区分哪些变量是全局的,哪些是局部的。

不过,好在在匿名函数里我们可以提供一个比较简单的替代方案,我们可以将全局变量当成一个参数传入到匿名函数然后使用,相比隐式全局变量,它又清晰又快,我们来看一个例子:

(function($, YAHOO){

// 这里,我们的代码就可以使用全局的jQuery对象了,YAHOO也是一样

})(jQuery, HAHOO);

现在很多类库里都有这种使用方式,比如jQuery源码。

不过,有时候可能不仅仅要使用全局变量,而是也想声明全局变量,如何做呢?我们可以通过匿名函数的返回值来返回这个全局变量,这也就是一个基本的Module模式,来看一个完整的代码:

var blogMoudle = (function(){

  var  my = {}, privateName  = '博客园 ';

  function privateAddTopic(data){

    //这里是内部处理代码

  }

  my.Name = privateName;

  my.AddTopic = function(data){

    privateAddTopic(data);

  };

  return my;

})();

上面的代码声明了一个全局变量blogModule,并且带有2个可访问的属性:blogModule.AddTopic和blogModule.Name,除此之外,其它代码都在匿名函数的闭包里保持着私有状态。同时根据上面传入全局变量的例子,我们也可以很方便地传入其它的全局变量。

JS 经典代码段总结 start from 2016-08-22的更多相关文章

  1. js经典代码技巧学习之一:使用三元运算符处理javascript兼容

    window.Event = { add: function() { //使用条件表达式检测标准方法是否存在 return document.addEventListener ? function(a ...

  2. js实用代码段(持续更新)

    1.得到一个数,在一个有序数组中应该排在的位置序号: function orderInArr(num,arr) { if(num > arr[0]){ return 1 + arguments. ...

  3. 在Sublime Text 3 中安装SublimeLinter,Node.js进行JS&CSS代码校验

    转载自:http://www.wiibil.com/website/sublimelinter-jshint-csslint.html 在Sublime Text中安装SublimeLinter,No ...

  4. 我们为什么要看《超实用的Node.JS代码段》

    不知道自己Node.JS水平如何?看这张图 如果一半以上的你都不会,必须看这本书,一线工程师用代码和功能页面来告诉你每一个技巧点. 都会一点,但不知道如何检验自己,看看本书提供的面试题: 1.     ...

  5. 实用的JS代码段(表单篇)

    整理了下比较实用的Javascript代码段,完整的代码参考 1 多个window.onload方法 由于onload方法时在页面加载完成后,自动调用的.因此被广泛的使用,但是弊端是只能实用onloa ...

  6. js让菜单栏一直悬浮在顶部,经典代码

    js让菜单栏一直悬浮在顶部,经典代码 很简单,你只需要把下面代码放到js中:$(function(){                //获取要定位元素距离浏览器顶部的距离        var na ...

  7. 超实用 JS 代码段笔记(一)

    序1:30段简单代码段(有删减) 1 . 区分 IE 和 非 IE 浏览器 if(!+[1,]){ console.log('ie浏览器'); }else{ console.log('非ie浏览器') ...

  8. 《超实用的Node.js代码段》连载三:Node.js深受欢迎的六大原因

    <超实用的Node.js代码段>连载一:获取Buffer对象字节长度 <超实用的Node.js代码段>连载二:正确拼接Buffer Node.js是一种后起的优秀服务器编程语言 ...

  9. 《超实用的Node.js代码段》连载二:正确拼接Buffer

    对于初学Node.js框架的开发人员来说,可能认为Buffer模块比较易学.重要性也不是那么突出.其实,Buffer模块在文件I/O和网络I/O中应用非常广泛,其处理二进制的性能比普通字符串性能要高出 ...

随机推荐

  1. python绝技 — 用Scapy解析TTL字段的值

    #!/usr/bin/env python #--*--coding=utf-8--*-- #打印收到的数据包的源IP和TTL值 from scapy.all import * def testTTL ...

  2. 生成 Qt 文档

    个人总结    从命令行进入Qt安装目录     设置环境变量     set path=D:/mingw32/bin;D:/Qt/5.0.0/qtbase/bin;D:/icu/bin;D:/icu ...

  3. html-----vedio标签(HTML5新标签VIDEO在IOS上默认全屏播放)

    今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的.然 ...

  4. background-size做自适应的背景图

    background-size做自适应的背景图 在我们做页面布局的时候往往会遇到这样的情况当我固定一个元素的尺寸,在像元素加入背景的时候发现背景图片的原始尺寸很大,当我把背景图写入时往往超过元素很大一 ...

  5. Dev的GridControl控件选择框的使用

    先介绍环境:VS2010,dev11.2 想要达到的效果:,当单击某一行时前面的选择框选中. 在网上找了不少,但是感觉跟我想的做法很不一样(有很多都是再另外添加一个什么CheckBox,这个我在Dev ...

  6. QCMediaPlayer mediaplayer NOT present(android)

    出现了“QCMediaPlayer mediaplayer NOT present”这个错误!!!我的手机是小米手机2,我给它刷机刷到了Android 4.4.4,后来我学长是这样解决的:case R ...

  7. nginx构建https

    1.生成证书#openssl genrsa -des3 -out server.key 1024#openssl req -new -key server.key -out server.csr#op ...

  8. hive-1.2.1安装步骤

    一.Hive安装和配置 1.先决条件 已经安装好hadoop-2.4.1,hbase-1.0.0. 2.下载Hive安装包 当前Hive可到apache官网下载,选择的是hive-1.2.1.运行: ...

  9. 快速挂载和分离VHD文件的小脚本

      =======代码开始======== echo select vdisk file= %VHD文件路径% echo attach vdisk exit 分离VHD的脚本,只需要将上述代码中 at ...

  10. 记一次-angular-数字格式化

    一个收费功能模块,需要做数据验证. input标签的ng-model的数据格式化 <input type="number" class="form-control& ...