javascript 特性

转载自：http://www.cnblogs.com/Moersing/p/4457481.html

作用域： javascript的作用域称为静态作用域，在定义语法上就能确认了，而不是运行时。

 if (true) {  var i = 'moersing' } console.log(i); //可以访问。

与C#，vb，java等语言不同，javascript没有所谓块级作用域概念，准确的说，就花括号之内定义的变量可以被外面访问到，但是，函数除外，因为函数本身是一个作用域。

 

另一个例子： 

var s= 'moersing'; var f= function () {   console.log(s); //这里输出的是undefined  var  s='lingfo';}f();

解释下为什么会这样，原因是javascript作用域搜索的问题，在调用函数f的时候，f作用域(函数都有一个局部作用域)，会初始化所有局部变量(只是初始化),于是，console.log()函数访问s的时候，s并没有被赋值，也就相当于 var s而已，所以输出undefind。

 

闭包特性：

function f (){   var count=0;   var get =function(){       count ++;       return count;    }return get;} var  getCount = f();console.log(getCount()); //1console.log(getCount());//2

通常，在不使用闭包的情况下，让一个变量递增的办法就是在外层定义一个变量，然后调用方法让其自增。

但是这样做的不好之处在于，别的地方也能访问这个变量，有时会很糟糕。

上面的例子就是一个闭包，在函数f执行完毕之后，返回一个get函数，这时候你可能会认为这个函数里面的count变量已经被销毁，

因为f已经超出作用域了，但实际上不是这样，在返回的get函数中，仍让保留着f的活动对象，当然也包括在其中定义的count变量，

所以，每一次调用get这个函数的时候，应用的都是count这个变量，也就实现了内部自增，除非通过f函数，否则无法访问这个count。

 

 

有些网友时常问，我想根据点击的按钮的位置(下标)来执行相应的操作，但是最后总是无法获取到下标，那是因为，在for循环中绑定的下标是是会变化的，当for循环执行完成后，下标的值总是等于 i+1。如： 

<div>0</div><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>7</div><div>8</div>var allDiv = document.querySelectorAll('div');for(var i=0;i<allDiv.length;i++){    allDiv[i].onclick=function(){
     alert(this.nodeName+i);
    }}
在这里，无论单击那个DIV，都会返回  DIV9，原因是，for循环最后一次++是等于9，而9 < allDiv.length =false，所以，循环退出，但是在每个div里面绑定事件是显示i的值，所以一直都是9.

  利用javascript提供的闭包特性可以解决这个问题。

<div>0</div><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>7</div><div>8</div>var allDiv = document.querySelectorAll('div');for(var i=0;i<allDiv.length;i++){   (function(i){        allDiv[i].onclick=function(){        alert(this.nodeName+i);    }    })(i);}

对于闭包特性，通俗来讲，就是嵌套的函数包含了父函数的作用域和本身的作用，这个新的作用域称为闭包特性，但是要记住，当父函数返回之后，作用域就被销毁，但是其活动对象还是会保留在嵌套的函数之中。

另外一个就是:慎用闭包，特别是在操作有关DOM处理的时候，如果一不小心，会造成内存泄露。

 

this对象：

var  m = {name:'moersing',func:function(console.log(this.name))} var t = {name:'linfo',}m.func(); // moersingt.func= m.func;t.func();//linfo;

 

 

在m的func函数中，引用了this(上下文对象)即被调用的函数所处的环境(作用域)，而下面的t.func指向了m.func，那么，实际上就相当于  t.func={console.log(this.name)}，接下来就浅显易懂了，调用t的func，那么，this这个上下文对象就相当于t，那么也就是t.name。所以结果输出了linfo。

call和apply：

call和apply的执行机制是一样的，他可以设置函数的执行环境，也就是说可以改变一个函数所处的位置(非物理)，别忘了，函数的上下文对象(this)也是根据函数所处的位置变换的。

首先，看看call： 

  

 var m = {    name:'moersing',    age:18,    print:function(){  console.log(this.name+this.age)  }}   var t = {name:'linfo',age:20} m.print.call(t); //info 20

 

这里，在运行时，将print函数的执行环境改变成了t(call函数第一个参数是一个对象，就是上下文对象)，那么，this.name

就相当于 t.name，同理，age也是一样的。

apply与call一样，只不过他可以传递数组 fun.call(obj,[1,2,3,........]);

 

__proto__和prototype和constructor:

__proto__：指向对象的原型。prototype:指向了构造函数的原型对象。constructor：对象(包括原型)有一个constructor属性，这个属性指向了其所在的函数。

 

注：对象和实例是相同的概念。

也就是说，prototype和constructor是间接互相引用的。

值得区分的就是 __proto__和prototype： 

这两个对于有经验的人也许会有点困惑，__proto__是存在于实例与构造函数之间的，而prototype是存在于构造函数和原型之间的。

这也就是为什么，构造函数有prototype和__proto__，而实例只有__proto__。别忘了，构造函数也是对象。

很多人误认为，构造函数的__proto__和prototype是指向相同的原型，实际上不是的,看一个例子： 

 function c (){ };  alert(c.__proto__); // function empty() alert(c.prototype); // c 从上面可以看出两者之间的不同。  var cc= new c(); alert(cc.__proto__==c.prototype); //true

如果使用c作为构造函数，那么cc实例的__proto__就和c.prototype一致了。

下面是一些例子：

console.log(obj.__proto__ === Object.prototype) // trueconsole.log(arr.__proto__ === Array.prototype)  // trueconsole.log(reg.__proto__ === RegExp.prototype) // trueconsole.log(date.__proto__ === Date.prototype)  // trueconsole.log(err.__proto__ === Error.prototype)  // true

从上面可以看出，对象实例的__proto__都指向了构造该对象的原型对象。

例如： Object 构造了obj (var o={})   那么这个对象的__proto__就指向了 Object.prototype。

另外，Object.prototype是最高层的原型，根据原型链搜索的概念  任何对象  instanceof  Object 都是true。

总结：对于__proto__和prototype的概念，千万要记住的就是，两者之间没有可比性，一个是存在于实例和原型之间，一个是存在于构造函数和原型之间。

本人纯属菜鸟，如果有什么不对的地方，还请指正，原创文章，转载请注明地址。QQ：1261870167