es6 初级之箭头函数

1.先看一个例子：

 <script>
         function show() {
             console.log('aluoha');
         }
         show();
 </script>

2. 改写成简单的箭头函数：

    var show = () => console.log('箭头:aluoha');
    show();

3. 1 包含return 的常规函数：

         function show() {
             return 10;
         }
         console.log(show());

3.2 包含return 的箭头函数：

错误写法：

      var show = () =>return 10;
      console.log(show());

运行结果：

正确写法：

         var show = () => {
             return 10;
         };
         console.log(show());
     

小结：在箭头函数中，有return 返回值时，需要使用{}把函数体包裹起来

4.1 箭头函数的参数

        var show = val => val;
        console.log(show(100));

4.2 只有一个参数也可以写成：

        var show = val => {
             return val;
         }
         console.log(show(10));    

4.3 一个参数，也可以加括号（）包含：

       var show = (val) => {
            return val;
        }
        console.log(show(100));

4.4 箭头函数，多个参数：

        var add = (a, b) => {
             return a + b;
         }
         console.log(add(10, 20));    

4.5 箭头函数不可实例化：

         var show = () => console.log('aluoha');
         show();
         new show(); //报错    

正常函数可以实例化：

         function show() {
             console.log('aluoha');
         }
         show();
         new show();

5.1 this指向：

         var show = () => {
             console.log(this); //this->window
         }
         show();

5.2 this调用：实际调用 window.a

         var a = 101;
         var show = () => {
             console.log(this.a);
         }
         show();

5.3.1 this指向宿主对象：（不传参）

         var userName = 'global';
         function User(name) {
             this.userName = name;

             this.showUserInfo = () => {
                 return this.userName;
             };
             this.showName = function() {
                 return this.userName;
             };
         }
         var oUser = new User();
         console.log(oUser.showUserInfo());
         console.log(oUser.showName());

5.3.2 传参调用：

         var userName = 'global';
         function User(name) {
             this.userName = name;

             this.showUserInfo = () => {
                 return this.userName;
             };
             this.showName = function() {
                 return this.userName;
             };
         }
         var oUser = new User("aluoha");
         console.log(oUser.showUserInfo());
         console.log(oUser.showName());