箭头函数

最新推荐文章于 2025-05-28 19:34:53 发布

一颗帅白菜

最新推荐文章于 2025-05-28 19:34:53 发布

阅读量58

点赞数

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.youkuaiyun.com/qq_52656116/article/details/130290434

版权

文章详细介绍了箭头函数在JavaScript中的特性，包括省略小括号和return的情况、没有arguments对象、不能用作构造函数、没有prototype属性以及call和apply对其this指向的影响。同时，文中通过示例展示了箭头函数中this的绑定规则，始终指向定义时的作用域而非调用时的作用域。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

箭头函数

箭头函数

将原函数的“function”关键字删掉，并使用“=>”连接参数列表和函数体

var fn_1 = function(a, b){
	return a + b
}
var fn_1 = (a, b) => {
    return a + b
}
fn_1()

1、如果有一个参数可以省略小括号

let demo = x => {
    console.log(x);
}
demo(1)

2、如果函数只有一条返回值语句，可以省略{}和return

let demo = x => x
console.log(demo(1));

3、箭头函数没有augrments内置对象

let demo_1 = () => {
    console.log(arguments); // 报错 arguments is not defined
}
demo_1()

4、箭头函数不能用于创建构造函数

Person = () => {
	console.log('111)
}
let p1 = new Person()
console.log(p1); // Person is not a constructor

5、箭头函数没有prototype属性

Person = () => {
	console.log('111)
}
Person()
console.log(Person.prototype); // undefined

6、call，apply可以调用箭头函数，但是不能改变this指向

var name = 'window'
let demo = function () {
    console.log('测试');
    console.log(this.name);
}
var obj = {
    name: 'obj'
}
demo() // window
demo.call(obj) // obj
demo.apply(obj) // obj

7、箭头函数的this指向父作用域，（调用它的地方）

window.color = "red";
// var color = "green";
// let 声明的全局变量不具有全局属性，即不能用window.访问
let color = "green";
let obj_1 = {
    color: "blue",
    getColor: () => {
    return this.color; // this指向window
}
};
let sayColor = () => {
    return this.color; // this指向window
};
console.log(obj_1.getColor())
obj_1.getColor(); // green red
console.log(sayColor())
sayColor(); // green red