ES5新增语法

ES5中给我们新增了一些方法，可以很方便的操作数组或者字符串，这些方法主要包括：数组方法、字符串方法、对象方法。

1. 数组方法

迭代（遍历）方法：forEach() 、map()、filter()、some()、every()

2. 对象方法

(1) Object.key()用于获取对象自身所有的属性

object.keys(obj)

效果类似for...in，返回一个由属性名组成的数组。

// 用于获取对象自身所有属性
var obj = {
  id: 1,
  pname: '小米',
  price: 1999,
  num: 2000
};
Object.keys(obj);
console.log(Object.keys(obj)); // ['id', 'pname', 'price', 'num']

(2) Object.defineProperty()定义对象中新属性或者修改原来的属性

Object.defineProperty(obj, prop, descriptor);

obj: 必需。目标对象
prop: 必需。需定义或修改的属性的名字
descriptor: 必需。目标属性所拥有的的特性

// 用于获取对象自身所有属性
var obj = {
  id: 1,
  pname: '小米',
  price: 1999,
};
// 以前的对象添加和修改属性的方法
// obj.num = 1000;
// obj.price = 99;
// 2. Object.defineProperty()定义新属性或修改原来的属性
Object.defineProperty(obj, 'num', {
  value: 1000
});

3. let、const、var区别

使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象。
使用let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升。
使用const声明的是常量，在后面出现的代码中，不能再修改该常量的值。

4. 解构赋值

ES6中允许从数组中提取值，按照对应位置，对变量赋值。对象也可以实现解构。

数组解构：

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

对象解构：

对象结构允许我们使用变量的名字匹配对象的属性，匹配成功，将对象属性的值赋值给变量。

let person = {
  name: 'zhangsan',
  age: 20
};
let {name, age } = person;
console.log(name); // 'zhangsan'
console.log(age);  // 20

5.箭头函数

ES6中新增的定义函数的方式

() => {}
const fn = () => {}

函数体中只有一句代码，且代码的执行结果就是返回值，可以省略大括号

function sum(num1, num2) {
  return num1 + num2;
} 
const sum = (num1, num2) => num1 + num2;
const result = sum(10, 20);
console.log(result); // 30

// 箭头函数-面试题
// 对象不能产生作用域，say方法下的this指向window
var age = 100;
var obj = {
  age: 20,
  say: () => {
    console.log(this.age); 
  }
}
obj.say(); // 100

6. 剩余参数

剩余参数语法允许我们将一个不定数量的参数，表示为一个数组

function sum (first, ...args) {
  console.log(first);  // 10
  console.log(args);  // [20, 30]
}
sum(10, 20, 30);

7. 扩展运算符

// 合并数组
let ary1 = [1, 2, 3];
let ary2 = [3, 4, 5];
let ary3 = [...ary1, ...ary2];
console.log(ary3); // [1, 2, 3, 3, 4, 5]

8.构造函数方法: Array.from( )

将类数组或可遍历对象转换成真正的数组

// 构造函数方法array.from
let arrayLike = {
  '0': 1,
  '1': 2,
  '2': 3,
  'length' : 3
}
let arr2 = Array.from(arrayLike, item => item * 2); 
console.log(arr2); // [2, 4, 6]

9. 实例方法find()

用于找出第一个符合条件的数组成员，如果没有找到返回undefined

let ary = [{
  id: 1,
  name: '张三'
}, {
  id: 2,
  name: '李四'
}];
let target = ary.find((item, index) => item.id === 2);
console.log(target); // {id: 2, name: '李四'}

10.实例方法findIndex()

用于找出第一个符合条件的数组成员的位置, 如果没有找到返回-1

let ary = [1, 5, 10, 15];
let index = ary.findIndex((value, index) => value > 9);
console.log(index); // 2

11. 实例方法：includes()

表示某个数组是否包含给定的值，返回布尔值

[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false

12.模板字符串

模板字符串中可以解析变量

let name = '张三';
let sayHello = `hello, my name is ${name}`; 
console.log(sayHello); // hello, my name is 张三

13.数据结构

ES6提供了新的数据结构set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

const s3 = new Set(["a","a","b","b"]);
console.log(s3)