【ES6基础】es6中新键加入的方法及代码-展开运算符-解构赋值（四）

这个系列文章的几篇推文的链接在这：

第四篇 扩展运算符与箭头函数

第三篇 promise

第二篇 filter、includes、fill、object.assign

第一篇 set、map

一、聊聊es6中的新的方法

• Set
• map
• filter
• includes
• fill
• object.assign
• promise
• 展开运算符
• 箭头函数

---

前言

es6是js语言下的下一代标准，使得js语言可以用来编写复杂的大型应用程序，成为企业级的开发语言。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、展开运算符

展开运算符是指将数组方法或对象进行展开。

1.1 展开运算符（…）是将一个数组转换为类函数参数序列

console.log(...[1,2,3])//1 2 3
function add(x,y){
return x+y;
}
let arr=[5,8]
add(...arr);//13

1.2 结构赋值

数组和对象的结构赋值：

const [arg,arg1,...arg2]=['a','b','c','d']
console.log(arg);
console.log(arg1);
console.log(arg2);
结果：
a
b
['c','d']

对象的结构赋值：

• log1对应obj中的log1；log2对应obj中的log2，但是obj中的作用域未被赋值到，所以才会有（1，undefined）。
• 箭头函数的this并不指向调用他的对象，而是this 绑定的就是最近一层非箭头函数的 this，箭头函数的this指向在定义（注意：是定义时，不是调用时）的时候继承自外层第一个普通函数的this。如果没有那就是全局变量：

var msg1 = 1;
const msg2 = 2;
const obj = {
    msg1: 3,
    msg2: 4,
    log1: function() {
        console.log(this.msg1, this.msg2)
    },
    log2: () => {
        console.log(this.msg1, this.msg2)
    }
};
const {
    log1,
    log2
} = obj;

obj.log1();//3,4
obj.log2();//1,undefined
log1();//1,undefined
log2();//1,undefined

let obj = {
  a: 10,
  b: () => {
    console.log(this.a); // undefined
    console.log(this); // Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}
  },
  c: function() {
    console.log(this.a); // 10
    console.log(this); // {a: 10, b: ƒ, c: ƒ}
  }
}
obj.b(); 
obj.c();

1.3 合并数组与对象

let a=[1,2,3];
let b=[4,5,6];
const c=[...a,...b]
console.log(c)
//[1,2,3,4,5,6]

1.4 帮助完成vuex中函数的映射

展开运算符帮助完成vuex中函数的映射

---

二、箭头函数

2.1 箭头函数是什么：

(argument1, argument2, ... argumentN) => {
  // function body
}

括号内的为箭头函数的参数，=>为箭头函数标志的胖箭头，后面的为函数体。

2.2 箭头函数的适用场景

箭头函数适合于无复杂逻辑或者无副作用的纯函数场景下，例如：在map、reduce、filter的回调函数定义中。但是在有多层函数嵌套的情况下，箭头函数反而影响了函数的作用范围的识别度，箭头函数不适合定义对象的方法，因为箭头函数没有自己的this，其内部的this指向的是离自己最近的作用域。
总结为下：

1. 若有一个简短单句在线函数表达式:
2. 唯一的语句是return某个计算的值
3. 函数内部没有this引用
4. 没有自身引用（递归、事件绑定/解绑定）

2.3 箭头函数与普通函数的区别：

特性	箭头函数	普通函数
构造函数	不可以作为构造函数	可以作为构造函数
原型	没有原型	有原型
绑定arguments	不绑定arguments	绑定arguments
this指向改变	call、apply、bind不会改变其this指向	call、apply、bind会改变其this指向
this指向	定义该函数时所在的作用域指向的对象	使用时所在的作用域指向的对象

---

码字不易~， 各位看官要是看爽了，可不可以三连走一波，点赞皆有好运！，不点赞也有哈哈哈~~~