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)