作用域: 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=;
var get =function(){
count ++;
return count;
}
return get;
}
var getCount = f();
console.log(getCount()); //
console.log(getCount());//
通常,在不使用闭包的情况下,让一个变量递增的办法就是在外层定义一个变量,然后调用方法让其自增。
但是这样做的不好之处在于,别的地方也能访问这个变量,有时会很糟糕。
上面的例子就是一个闭包,在函数f执行完毕之后,返回一个get函数,这时候你可能会认为这个函数里面的count变量已经被销毁,
因为f已经超出作用域了,但实际上不是这样,在返回的get函数中,仍让保留着f的活动对象,当然也包括在其中定义的count变量,
所以,每一次调用get这个函数的时候,应用的都是count这个变量,也就实现了内部自增,除非通过f函数,否则无法访问这个count。
 
 

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

<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div> var allDiv = document.querySelectorAll('div');
for(var i=;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></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div> var allDiv = document.querySelectorAll('div');
for(var i=;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(); // moersing
t.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:,
print:function(){ console.log(this.name+this.age) }
}
var t = {name:'linfo',age:}
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) // true
console.log(arr.__proto__ === Array.prototype) // true
console.log(reg.__proto__ === RegExp.prototype) // true
console.log(date.__proto__ === Date.prototype) // true
console.log(err.__proto__ === Error.prototype) // true
从上面可以看出,对象实例的__proto__都指向了构造该对象的原型对象。
例如: Object 构造了obj (var o={})   那么这个对象的__proto__就指向了 Object.prototype。
另外,Object.prototype是最高层的原型,根据原型链搜索的概念  任何对象  instanceof  Object 都是true。
总结:对于__proto__和prototype的概念,千万要记住的就是,两者之间没有可比性,一个是存在于实例和原型之间,一个是存在于构造函数和原型之间。

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

javascript 特性的更多相关文章

  1. JavaScript特性(attribute)、属性(property)和样式(style)

    最近在研读一本巨著<JavaScript忍者秘籍>,里面有一篇文章提到了这3个概念. 书中的源码可以在此下载.我将源码放到了线上,如果不想下载,可以直接访问在线网址,修改页面名就能访问到相 ...

  2. HTML5中新增Javascript特性

    存储 localStorage 存储: window.localStorage.setItem('key', 'value'); 取值: window.localStorage.getItem('ke ...

  3. ES6:JavaScript 新特性

    我相信,在ECMAScript.next到来的时候,我们现在每天都在写的JavaScript代码将会发生巨大的变化.接下来的一年将会是令JavaScript开发者们兴奋的一年,越来越多的特性提案将被最 ...

  4. JavaScript权威设计--Window对象(简要学习笔记十三)

    1.Window对象是所有客户端JavaScript特性和API的主要接入点. Window对象中的一个重要属性是document,它引用Document对象. JavaScript程序可以通过Doc ...

  5. JavaScript资源大全中文版(Awesome最新版--转载自张果老师博客)

    JavaScript资源大全中文版(Awesome最新版)   目录 前端MVC 框架和库 包管理器 加载器 打包工具 测试框架 框架 断言 覆盖率 运行器 QA 工具 基于 Node 的 CMS 框 ...

  6. 顶级的JavaScript框架、库、工具及其使用

    几乎每隔一个星期,就有一个新的 JavaScript 库席卷网络社区!Web 社区日益活跃.多样,并在多个领域快速成长.想要研究每一个重要的 JavaScript 框架和库,是个不可能完成的任务.接下 ...

  7. 悟透JavaScript

    要理解JavaScript,你得首先放下对象和类的概念,回到数据和代码的本原.前面说过,编程世界只有数据和代码两种基本元素,而这两种元素又有着纠缠不清的关系.JavaScript就是把数据和代码都简化 ...

  8. 悟透JavaScript(理解JS面向对象的好文章)

    引子 编程世界里只存在两种基本元素,一个是数据,一个是代码.编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力. 数据天生就是文静的,总想保持自己固有的本色:而代码却天生活泼,总想改变这个 ...

  9. JavaScript中的apply和call函数详解(转)

    每个JavaScript函数都会有很多附属的(attached)方法,包括toString().call()以及apply().听起来,你是否会感到奇怪,一个函数可能会有属于它自己的方法,但是记住,J ...

随机推荐

  1. 【Oracle 函数索引】一次数据库的优化过程

    [问题]表里数据2万条,查询执行时间 818087.38 ms(12分钟). SQL语句如下:select   F1,F2,F3,F4   from t_sms_g_send t   left joi ...

  2. C:结构体

    结构体 构造类型:就是有基本的类型组成的 1.结构体  结构体是一种自定义的数据类型 和 int float 是一样的都可以定义变量 数组 只能存放一种类型的容器 结构体   可以存放多种数据类型  ...

  3. Python学习入门基础教程(learning Python)--5.2 Python读文件基础

    上节简单的说明了一下Pyhon下的文件读写基本流程,从本节开始,我们做几个小例子来具体展示一下Python下的文件操作,本节主要是详细讲述Python的文件读操作. 下面举一个例子,例子的功能是读取当 ...

  4. 【6】连续序列和为s

    题目:输入一个整数s,打印出全部和为s的连续整数序列(至少含有2个数).比如输入9,则输出2.3.4和4.5两个序列 方案一:因为序列至少要2个数,则两个数上限值为(1+s)/2,我们能够枚举该序列的 ...

  5. .NET企业轻量级开发框架(APS.NET+Spring.Net+NHibernate)

          在<企业级应用架构>系列文章发表之余,也得到了许多同行的反馈,有人说这套框架太重了或者技术学习太复杂了或者初学者不太好理解或者完全颠覆了传统APS.NET开发模式让人望而生畏. ...

  6. jQuery Mobile与QUI框架的异曲同工之处

    最近一直在研究jQuery Mobile框架,这是jQuery的官方移动版UI框架,专门用来开发手机与平板电脑方面的应用.结果越来越觉得它和我的QUI框架的开发思路非常相似,很多地方都有异曲同工之妙. ...

  7. Android开发 设置开机自动启动

    原文:http://blog.csdn.net/kevinmeng_ini58/article/details/7700786 片段一: <!-- 开机启动 --> <receive ...

  8. 【JavaScript】谈谈Google Polymer以及Web UI框架的未来

    摘要:开发者Axel Rauschmayer在自己的博客上详解了Google Polymer的设计理念与组成架构,深得Polymer开发者的认同.他认为Polymer这样高互操作性的设计才应该是Web ...

  9. Java生成 Word文档的并打印解决方案

    户要求用程序生成标准的word文档,要能打印,而且不能变形,以前用过很多解决方案,都在客户严格要求下牺牲的无比惨烈. POI读word文档还行,写文档实在不敢恭维,复杂的样式很难控制不提,想象一下一个 ...

  10. Golang学习 - strconv 包

    ------------------------------------------------------------ // 将布尔值转换为字符串 true 或 false func FormatB ...