JavaScript基础核心特性的理解
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:admin 阅读 2189
深入理解JavaScript系列文章,包括了原创,翻译,转载等各类型的文章,假如对你有用,请推荐支持一把,给大叔写作的动力。同步与推荐实现如下语法的功能:vara=add(2)(3)(4)//9实现

深入理解JavaScript系列文章,包括了原创,翻译,转载等各类型的文章,假如对你有用,请推荐支持一把,给大叔写作的动力。

 


同步与推荐


  • 实现如下语法的功能:var a = add(2)(3)(4); //9
  • 实现如下语法的功能:var a = (5).plus(3).minus(6); //2
  • 利用JavaScript打印出Fibonacci数(不使用全局变量)
  • 给object数组进行排序(排序前提是每个元素对象的属性个数)
  • 转化一个数字数组为function数组(每个function都弹出相应的数字)
  • 找出数字数组中最大的元素(使用Match.max函数)

    大叔注:这些标题题目也是来自出这5个标题题目的人,当然假如你能答对4个及以上并且想拿高工资的话,请联系我。


    假如大家有爱好,可以继承研究下面的一些标题题目,具体通过这些标题题目也可以再次加深对JavaScript基础核心特性的理解。


    更多标题题目


    关于JavaScript的基本核心内容和理解基本上在该系列就到此为止了,接下来的章节除了把五大原则剩余的2篇补全依然,会再加两篇关于DOM的文章,然后就开始转向收拾整顿关于JavaScript模式与设计模式相关的文章了(大概10篇左右),随后再会花几个章节来一个实战系列。


    这5个标题题目固然貌似有点偏,但实际上考察的依然是基本概念,只有熟知了这些基本概念才能写出高质量代码。


    总结


    所以弹出的结果是[object Window]就很轻易理解了。

      
     

      function a() {  

    另外,根据ECMAScript262规范划定:假如第一个参数传入的对象调用者是null或者undefined的话,call方法将把全局对象(也就是window)作为this的值。所以,无论你什么时候传入null,其this都是全局对象window,所以该标题题目可以理解成如下代码:

    第一个依然是true没什么好说的,第二个传入的调用对象是document,天然不会即是window,所以弹出了false。

    method.call(document); //false
      function method() {  

    了解了上述概念之后,我们再来了解一下call()是做什么的,call方法作为一个function执行代表该方法可以让另外一个对象作为调用者来调用,call方法的第一个参数是对象调用者,随后的其它参数是要传给调用method的参数(假如声明了的话),例如:

    method();
      function method() {  

    上面的代码,调用method()的时候this被指向到调用它的object对象上,但在全局作用域里,this是等价于window(浏览器中,非浏览器里等价于global),在假如一个function的定义不是属于一个对象属性的时候(也就是单独定义的函数),函数内部的this也是等价于window的,例如:

    object.method();
      var object = {  

    首先,就是this值是如何定义的,当一个方法在对象上调用的时候,this就指向到了该对象上,例如:

    这个标题题目可以说是最简朴的,也是最诡异的,由于假如没学到它的定义的话,打死也不会知道结果的,关于这个标题题目,我们先来了解2个概念。

    a.call(null);
      function a() {  

    标题题目5

    b(1, 2);
      function b(x, y, a) {  

    这时候由于没传递第三个参数a,所以赋值10以后,alert(a)的结果依然是undefined,而不是10,但如下代码弹出的结果依然是10,由于和a没有关系。

    b(1, 2);
      function b(x, y, a) {  

    这个共享实在不是真正的共享一个内存地址,而是2个不同的内存地址,使用JavaScript引擎来保证2个值是随时一样的,当然这也有一个条件,那就是这个索引值要小于你传入的参数个数,也就是说假如你只传入2个参数,而还继承使用arguments[2]赋值的话,就会不一致,例如:

    • properties-indexes (字符串类型的整数) 属性的值就是函数的参数值(按参数列表从左到右排列)。 properties-indexes内部元素的个数即是arguments.length. properties-indexes 的值和实际传递进来的参数之间是共享的。

      a.call(window);
      }
      alert(this); method(); //true } alert(this === window); } alert(this === window); //true } } alert(this === object); //true method: function() { } alert(this); } alert(arguments[2]); arguments[2] = 10; } alert(a); arguments[2] = 10;
  • length — 真正传递的参数个数
  • callee — 指向当前函数的引用

    Arguments对象是流动对象的一个属性,它包括如下属性:

      
     

      AO = {  

    关于这个标题题目,NC搬出了262-3的规范出来解释,实在从《深入理解JavaScript系列(12):变量对象(Variable Object)》中的函数上下文中的变量对象一节就可以清晰地知道,流动对象是在进入函数上下文时刻被创建的,它通过函数的arguments属性初始化。arguments属性的值是Arguments对象:

    b(1, 2, 3);
      function b(x, y, a) {  

    标题题目4

    而执行a的时候,相应地就弹出了函数a的内容了。

    }
      VO(global) = {  

    这个标题题目就是标题题目2里的大叔加的注释了,也就是函数声明和变量声明的关系和影响,碰到同名的函数声明,VO不会重新定义,所以这时候全局的VO应该是如下这样的:

    alert(a);
      function a(x) {  

    标题题目3

    上述例子中,变量a在函数a后面,那么,变量a碰到函数a怎么办呢?仍是根据变量对象中先容的,当变量声名碰到VO中已经有同名的时候,不会影响已经存在的属性。而函数表达式不会影响VO的内容,所以b只有在执行的时候才会触发里面的内容。

     

    进入执行上下文: 这里泛起了名字一样的情况,一个是函数声名,一个是变量声名。那么,根据深入理解JavaScript系列(12):变量对象(Variable Object)先容的,填充VO的顺序是: 函数的形参 -> 函数声名 -> 变量声名。

    大叔注:安装ECMAScript规范,作者对函数声明笼盖变量声明的解释实在不正确的,准确的理解应该是如下:

    这样的话,就很清楚地知道为什么alert的老是1了,具体内容请参考《深入理解JavaScript系列(2):揭秘命名函数表达式》中的内容。

    alert(a);
      var a = 1,  

    理解上述内容之后,该标题题目换成一个更正确和更轻易理解的代码应该像这样:

    重新回到标题题目,这个函数实在是一个有名函数表达式,函数表达式不像函数声明一样可以笼盖变量声明,但你可以留意到,变量b是包含了该函数表达式,而该函数表达式的名字是a;不同的浏览器对a这个名词处理有点不一样,在IE里,会将a以为函数声明,所以它被变量初始化笼盖了,就是说假如调用a(--x)的话就会犯错,而其它浏览器在答应在函数内部调用a(--x),由于这时候a在函数外面依然是数字。基本上,IE里调用b(2)的时候会犯错,但其它浏览器则返回undefined。

    该value赋值以后,变量赋值初始化就笼盖了函数声明。

    alert(typeof value); //"number"
      function value(){  

    尽快变量声明在下面定义,但是变量value依然是function,也就是说这种情况下,函数声明的优先级高于变量声明的优先级,但假如该变量value赋值了,那结果就完全不一样了:

    alert(typeof value); //"function"
      function value(){  

    第三需要知道的是,函数声明会笼盖变量声明,但不会笼盖变量赋值,为了解释这个,我们来看一个例子:

    澄清一下,函数表达式没有提前,就相称于平时的变量赋值。

    };
      var functionName = function(arg1, arg2){  

    如下不是函数,而是函数表达式,相称于变量赋值:

    }
      function functionName(arg1, arg2){  

    量声明一样。澄清一下,函数声明是如下这样的代码:

    首先,在标题题目1里我们知道了变量声明在进入执行上下文就完成了;第二个概念就是函数声明也是提前的,所有的函数声明都在执行代码之前都已经完成了声明,和变

    这个标题题目看起来比实际复杂,alert的结果是1;这里依然有3个重要的概念需要我们知道。

    alert(a);
      var a = 1,  

    标题题目2

    大叔注:相信良多人都是以为a在里面不可访问,结果才是undefined的吧,实在是已经有了,只不外初始值是undefined,而不是不可访问。

    然后执行代码的时候才开始走if语句,具体信息请查看《深入理解JavaScript系列(12):变量对象(Variable Object)》中的处理上下文代码的2个阶段小节。

    这个时候a已经有了;

    }
      VO(global) = {  

    大叔注:提前这个词语显得有点疑惑了,实在就是执行上下文的关系,由于执行上下文分2个阶段:进入执行上下文和执行代码,在进入执行上下文的时候,创建变量对象VO里已经有了:函数的所有形参、所有的函数声明、所有的变量声明

    这样,标题题目的意思就非常清晰了:首先声明a,然后判定a是否在存在,假如不存在就赋值为1,很显著a永远在window里存在,这个赋值语句永远不会执行,所以结果是undefined。

    alert(a);
      var a;  

    所以,知道了这些概念以后,重新回头看一下标题题目的代码,实在就等价于:

    当变量声明和赋值在一起用的时候,JavaScript引擎会自动将它分为两部以便将变量声明提前,不将赋值的步骤提前是由于他有可能影响代码执行出不可预期的结果。

    a = 1; //初始化赋值
      var a;    //声明  

    你可以将语句拆分为如下代码:

    第三,你需要理解该标题题目的意思是,变量声明被提前了,但变量赋值没有,由于这行代码包括了变量声明和变量赋值。

    这样看起来就很轻易解释为什么alert结果是true了。

    alert("a" in window);
      var a;  

    此时,尽管声明是在alert之后,alert弹出的依然是true,这是由于JavaScript引擎首先会扫墓所有的变量声明,然后将这些变量声明移动到顶部,终极的代码效果是这样的:

    var a;
      alert("a" in window);  

    第二,所有的变量声明都在范围作用域的顶部,看一下相似的例子:

      "变量名称" in window

    首先,所有的全局变量都是window的属性,语句 var a = 1;等价于window.a = 1; 你可以用如下方式来检测全局变量是否声明:


    你可能以为alert出来的结果是1,然后实际结果是“undefined”。要了解为什么,我们需要知道JavaScript里的3个概念。


    代码看起来是想说:假如window不包含属性a,就声明一个变量a,然后赋值为1。


    alert(a);

      if (!("a" in window)) {  

    标题题目1

    OK,我们先看第一题

    (但标题题目2的解释貌似有点题目)
      题目来着大名鼎鼎的前端架构师Baranovskiy的帖子《So, you think you know JavaScript?》。    
      };
      arguments: <ArgO> } alert(a); arguments[2] = 10; a: 引用了函数声明“a” var a; } return x * 2; }; x && b(--x); b = function(x) { var value = 1; } return 1; var value; } return 1; //函数体 //函数体 }; x && a(--x); b = function a(x) { a: undefined } a = 1; if (!("a" in window)) {
      }
      var a = 1; 谜底也是来着大名鼎鼎的JS牛人Nicholas C. Zakas的帖子《》——《JavaScript高级程序设计》一书的原作者 
联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2