码迷,mamicode.com
首页 > Web开发 > 详细

【JS语法】作用域与绑定图示

时间:2019-09-14 13:45:39      阅读:102      评论:0      收藏:0      [点我收藏+]

标签:log   java   www   ati   语法   join   and   不同   参考   

起因:作用域攀爬

  • JavaScript 允许在函数体内部,引用当前环境的其他变量。
  • 当前环境找不到变量时,就攀爬到上一层区块寻找,直到攀爬到全局(window)为止。
  • this 指代的就是当前环境,所以其值是根据函数调用时的环境决定,并不是不变的。
    技术图片

绑定方式一:bind

  • bind 可以指定函数的任意上下文。
  • bind 处理函数不会立即执行,只会返回一个新的函数。
    技术图片

绑定方式二:call / apply

  • 在作用域绑定方面,call / apply 二者功能一致,可以替换。不同的只是参数传入的方式。
  • call / apply 处理函数是即时调用的,不会返回一个新的函数。所以与 bind 方式的区别在于使用场景,而不是功能。
  • 此方式主要用于
    • 类定义时,出借当前环境,达到继承的效果:
    function Product(name, price) {
      this.name = name;
      this.price = price;
    }
    function Food(name, price) {
      Product.call(this, name, price); 
      // <==> Product.apply(this, [name, price]);
      // <==> Product.bind(this, name, price)();
      this.category = 'food';
    }
    console.log(new Food('cheese', 5));
    • 函数调用时,以其它环境作为 this:
    function greet() {
      var reply = [ this.animal, 'typically sleep between', this.sleepDuration ].join(' ');
      console.log(reply);
    }
    var obj = {
      animal: 'cats', sleepDuration: '12 and 16 hours'
    };
    greet.call(obj);  // cats typically sleep between 12 and 16 hours
    技术图片

参考资料

【JS语法】作用域与绑定图示

标签:log   java   www   ati   语法   join   and   不同   参考   

原文地址:https://www.cnblogs.com/mazhaokeng/p/11518825.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!