箭头函数

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
//     函数分类:
//         有名
//         无名
//         匿名
//         箭头函数 类似于 无名函数 ()=>{}
//                 不允许直接存在,值存在
//                 值存在,赋值式
//                 实参,回调函数
//                 事件处理函数
                // 匿名函数的函数体
     var fn = ()=>{
         console.log(1)
     };
     console.log(fn)//()=>{console.log(1) };
     console.log(typeof fn)//function
     fn();//

//     var fn = a=>"你好"+a;

     var fn = a=>({a:10,b:20});
//
     console.log(fn("admin"))//{a: 10, b: 20} 不管fn括号内写的什么都没用。

    // 简单,方便,快捷,体量小
    // 箭头函数没有自己的执行上下文
    // 需要使用上层函数的执行上下文
    // 箭头函数会自动绑定外层this

     function fn(){
         setTimeout(()=>{ //这里代替了无名函数 。function 换成了()=>
             console.log(this)
         }, 1000);
     }
     var obj = {
         a:10,
         fn:fn
     }
     obj.fn()//{a: 10, fn: ƒ}

    // 所有函数都可以被new执行,但是,除了箭头函数

     var fn1 = function(){}
     var fn2 = ()=>{}
     console.dir(fn1)//ƒ fn1()
     console.dir(fn2)//fn2()

</script>
</html>

 

posted @ 2019-08-30 16:21  菜鸟小何  阅读(199)  评论(0编辑  收藏  举报