javascript - es6中箭头函数有无作用域,this指向,能否使用arguments,为什么?
伊谢尔伦
伊谢尔伦 2017-04-11 12:44:40
[JavaScript讨论组]

es6中箭头函数有无作用域,this指向,能否使用arguments,为什么?

很疑惑为什么不是能使用arguments
还有不是所有函数都会有作用域吗
那箭头函数应该也有吧

伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

全部回复(4)
巴扎黑

上面一位的答案好长,不清楚解决了问题没,我来做个简单的回答好了。

1.箭头函数有作用域(词法作用域),词法作用域简单来讲就是,一切变量(包括this)都根据作用域链来查找。

2.箭头函数中的this因为绑定了词法作用域,所以始终指向自身外的第一个this(由于自身没有声明this,所以会去作用域链上找this),也就是始终等于调用它的函数的this(以为这个this离它最近)。

3.严格模式下不允许使用arguments(规定),并且,普通函数里 arguments 代表了调用时传入的参数,但是箭头函数不是,箭头函数会把 arguments 当成一个普通的变量,顺着作用域链由内而外地查询(词法作用域)

4.arguments可以用...rest取代,所以完全没必要追求argument。

希望能帮到你 0_o

天蓬老师

箭头函数会继承外层函数调用的 this, 相当于在箭头函数外声明了一个self = this;
箭头函数中使用这个 self

arguments 能否适用是看该函数是否处于严格模式,严格模式是禁止适用的

补充:

const test = ()=>{
    console.log(arguments)
};

const test2 = ()=>{
    'use strict';

    console.log(arguments);

}

经过 babel 转义后:

/******/ (function(modules) { // webpackBootstrap
/******/     // The module cache
/******/     var installedModules = {};
/******/
/******/     // The require function
/******/     function __webpack_require__(moduleId) {
/******/
/******/         // Check if module is in cache
/******/         if(installedModules[moduleId])
/******/             return installedModules[moduleId].exports;
/******/
/******/         // Create a new module (and put it into the cache)
/******/         var module = installedModules[moduleId] = {
/******/             exports: {},
/******/             id: moduleId,
/******/             loaded: false
/******/         };
/******/
/******/         // Execute the module function
/******/         modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/         // Flag the module as loaded
/******/         module.loaded = true;
/******/
/******/         // Return the exports of the module
/******/         return module.exports;
/******/     }
/******/
/******/
/******/     // expose the modules object (__webpack_modules__)
/******/     __webpack_require__.m = modules;
/******/
/******/     // expose the module cache
/******/     __webpack_require__.c = installedModules;
/******/
/******/     // __webpack_public_path__
/******/     __webpack_require__.p = "http://10.1.67.126:8087/assets/";
/******/
/******/     // Load entry module and return exports
/******/     return __webpack_require__(0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ function(module, exports) {

    'use strict';
    
    var _arguments = arguments;
    /**
     * Created by juecai on 2017/3/16.
     */
    
    var test = function test() {
        console.log(_arguments);
    };
    
    var test2 = function test2() {
        'use strict';
    
        console.log(_arguments);
    };

/***/ }
/******/ ]);

注意最后

/* 0 */
/***/ function(module, exports) {

    'use strict'; //这里已经声明为严格模式
    
    var _arguments = arguments;
    
    
    var test = function test() {
        console.log(_arguments);
    };
    
    var test2 = function test2() {
        'use strict';
    
        console.log(_arguments);
    };

/***/ }
/******/ ]);
天蓬老师

使用注意点
箭头函数有几个使用注意点。
(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
(2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
(3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用Rest参数代替。
(4)不可以使用yield命令,因此箭头函数不能用作Generator函数。

箭头函数

ringa_lee

可以了解一下coffeescript里的胖瘦箭头,可能会有更好的理解

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号