ES6新增特性、方法以及使用

一、解构赋值+扩展运算符的应用

解构赋值： 按照一定的模式，从数组或对象中提取值，并对变量进行赋值

• 对象解构赋值

//对象解构赋值：是按属性名解构，顺序不重要，属性名必须正确
var obj = { uname: "张三", age: 21, sex: "男" }

var {uname,age,sex} = obj
console.log(uname, age)        // 张三 21


//给变量起别名，用冒号  以前的变量名自动失效
var { uname: name, age: a, sex } = obj
console.log(name, a, sex)      // 张三 21 男


/* 对象扩展运算符的使用 */
var { uname, ...rest} = obj
console.log(uname, rest)        // 张三 {age:21,sex:"男"}


// 对象解构：多层解构
var obj = {
    uname: "张三",
    age: 21,
    shcool: {
       name: "清华",
       address: "海淀"
    }
}
let { uname, age, shcool, shcool: { name, address } } = obj
console.log(uname, age, shcool, name, address)  // 张三 21 {name:"清华",address:"海淀"} 清华 海淀 

• 数组解构赋值

// 数组解构赋值：是按位置解构，名字可以随便取
var arr = ["北京", "上海", "广州", "深圳"]

//顺序要对应准确
var [xxx, yyy, c, d] = arr;     // 北京 上海 广州 深圳
    
/* 数组扩展运算符的使用 */
var [a, b, ...c] = arr
console.log(a, b, c)       // 北京 上海 ["广州","深圳"]

二、Map数据类型

map与object对象类似，都有key和value，但map的key可以是JS中的任何数据类型，传递参数的形式是一个二维数组

 操作Map的方法

1. set(key,value) ：添加数据（kay可以是任何数据类型）
2. get(key)：获取数据
3. delete(key)：删除数据
4. clear()：清空数据
5. forEach()：循环遍历（与数组参数相同）
6. has(key)：判断是否是map类型中的key

三、Set数据类型

set与array数组类似，但set的数据具有唯一性，不能重复，即使参数有重复的数据，set也只存储一次

操作Set的方法

1. add(value)：添加数据（虽然也可以添加复杂数据类型，但尽量不要添加）
2. delete(value)：删除数据（·复杂数据类型不能删除）
3. clear()：清空数据
4. forEach()：循环遍历（与数组参数相同）

5. has(value)：判断数据是否存在（·复杂数据类型不能查询）

 四、ES6对象方法

• 冻结对象 Object.freeze()    不可修改，不可删除

var obj = {uname:'张三',age:21}
Object.freeze(obj)
// console.log(obj);
obj.uname='哈哈'     // 不可修改
delete obj.age       // 不可删除
console.log(obj);

• 检测对象是否被冻结 Object.isFrozen()

var result = Object.isFrozen(obj)
console.log(result);   // true / false

• 将对象的键值对转为二维数组 Object.entries()

console.log(Object.entries(obj));  // [['uname','张三'],['age',21]]

• 封闭对象 Object.seal()   不可删除添加

Object.seal(obj)
// console.log(obj);
obj.address='北京'     // 不可添加
delete obj.uname       // 不可删除
obj.age = 50           // 可修改
console.log(obj);

• 检测对象是否封闭 Object.isSealed()

console.log(Object.isSealed(obj));   // true / false

• 检测对象属性的描述对象 Object.getOwnPropertyDescriptor()

Object.freeze(obj)   // 冻结对象
Object.seal(obj)     // 封闭对象
var result = Object.getOwnPropertyDescriptor(obj,'uname')   // 检测对象属性
console.log(result);

• 给对象添加属性 Object.defineProperty()

Object.defineProperty(obj,'age',{
     value:21,
     // 默认值都为false
     enumerable:true,   // 是否可遍历（可枚举）
     writable:true,     // 是否可写（修改）
     configurable:true, // 属性是否可删除
})
console.log(obj);

// 是否可遍历
for(k in obj){
     console.log(obj[k]);
}

// 是否可写（修改）
obj.age = 30
console.log(obj);

// 是否可删除
delete obj.age
console.log(obj);

• 合并对象 Object.assign()

var obj1 = { uname:"张三" , age:21 }
var obj2 = { sex:'男' , height:170 }

console.log(Object.assign(obj1,obj2));  // 可以将obj2合并到obj1中（相同属性会覆盖）

• ......