箭头函数的声明特点

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // 声明函数
    // 普通方式
    // let fn1=function(){

    // }
    // 箭头函数,省略function关键字
    let fn2=(a,b)=>{
        return a+b
    }
    // 调用函数
    console.log(fn2(1,3))
    // 1箭头函数中this是静态的,始终指向函数声明时所在作用域下的this的值
    function getName1(){
        console.log(this.name)
    }

    let getName2=()=>{
        console.log(this.name)
    }
    // 设置window对象的name属性
    window.name='北大'
    const SCHOOL={name:"交大"}
    // 直接调用,this指向window
    getName1();
    getName2();
    // call方法调用,可以改变this指向的值
    getName1.call(SCHOOL)
    // 这里依然指向全局window
    getName2.call(SCHOOL)

    // 2不能作为构造实例化对象
    // let Person=(name,age)=>{
    //     this.name=name;
    //     this.age=age;
    // }
    // 这里会报错:Uncaught TypeError: Person is not a constructor
    // let me =new Person('xiao',20);
    // console.log(me)

    // 3不能使用arguments变量,arguments是打印入参的一个伪数组
    // let fn3=()=>{
    //     console.log(arguments)
    // }
    // 这里报错: Uncaught ReferenceError: arguments is not defined
    // fn3(2,3,4)
    // 4箭头函数可以简写
    // (1)当参数只有一个,可以省略小括号
    let add=n=>{
        console.log(n+n)
    }
    add(10)
    // (2)当代码体只有一条语句的时候可以省略花括号,此时return也必须省略
    // 而且语句的执行语句就是该函数的返回值
    let pow=n=>n*n;
    console.log(pow(8));
</script>
</html>

 

posted @ 2024-12-25 16:58  鲁班大师智商二百五  阅读(15)  评论(0)    收藏  举报