jsmap箭头_JavaScript箭头函数（Lambda表达式）箭头函数也叫lambda表达式
据说其主要意图是定义轻量级的内联回调函数
栗有：
1 var arr = ["wei","ze","yang"];
2 arr.map(item=>"Mr."+item); // ["Mr.wei", "Mr.ze", "Mr.yang"]
实则
js arguments
1 var arr = ["wei","ze","yang"];
2 arr.map(function(item){
3 return "Mr."+item;
4 });
1.注意点：
(1)当箭头函数有⼀个参数的时候，参数可以不加括号，没有参数的时候就必须要加。
定义 函数名 = 参数 => 函数体
1 var student = name => "my name is " + name;
2 console.log(student("wei ze yang"));
3 // my name is wei ze yang
(2)如果函数体不⽌⼀⾏，应该⽤花括号括起来，这时就要显⽰地返回。
定义 函数名 = (参数，参数) => {
函数体；
return 返回值；
}
1 var student = (name,age) => {
2 age +=1;
3 return "name:" + name + ",age:" + age;
4 }
5 console.log(student("wei ze yang",21));
6 // name:wei ze yang,age:22
2.arguments object
正常的函数内：
1 function student(name,age){
2 console.log(arguments[0]);
3 }
4
5 student("weizeyang",22);
但箭头函数不会暴露argument对象
1 var student = (name,age) => {
2 console.log(arguments[0]);
3 }
4
5 student("weizeyang"); // arguments is not defined
所以，argument将简单地指向当前作⽤域内的⼀个变量
1 var arguments = ["Mr.wei"];
2
3 var student = (name,age) => {
4 console.log(arguments[0]);
5 }
6
7 student("weizeyang"); // "Mr.wei"
或者这时可以使⽤“剩余参数”的时候代替
1 var arguments = ["Mr.wei"];
2
3 var student = (...arguments) => {
4 console.log(arguments[2]);
5 }
6
7 student("weizeyang",22,true); // true
3.绑定this的值
箭头函数是lexically scoped(词法作⽤域)，这意味着其this绑定到了附近scope的上下⽂。也就是说，不管this指向什么，都可以⽤⼀个箭头函数保存。
1 var student = {
2 names:["wei","ze","yang"],
3 setName: function() {
4 console.log(this);
5 this.name = this.names.join("")
6 },
7 getName: function() {
8 console.log(this); 9 return () => {10 return {
11 myName : "my name is " + this.name
12 }
13 }14 }
15 }
16
17 student.setName();
18 var student1 = Name();
19 console.log(student1().myName);
20 // my name is weizeyang
有图为证，看下
4.相关⽂档
使⽤ this.$refs 来获取元素和组件
这是⼀个⼤⼤的H1
Vueponent('my-com', {
template: '
这是⼀个⼦组件
',
data() {
return {
name: '⼦组件'
}
}
});
// 创建 Vue 实例，得到 ViewModel
var vm = new Vue({
el: '#app',
data: {},
methods: {
getElement() {
// 通过 this.$refs 来获取元素
console.log(this.$h1.innerText);
// 通过 this.$refs 来获取组件console.log(this.$name); }
}
});

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。