介绍ES6提供的新的特性及对象⽅法
扩展运算符的使⽤:
(1)复制对象
(2)给对象设置默认值
(3)合并对象
属性初始化的简写
对象⽅法的简写
可计算的属性名
新增⽅法:
Object.is
Object.assign
Object.keys
Object.values
Object.entries
{
//对象中扩展运算符的使用
//复制对象 这里需要安装扩展运算符插件 cnpm install babel-plugin-transform-object-rest-spread
const obj = { name: 'Nick', video: 'es6'}
const initObj = { color: 'red'}
let vodeoObj = { ...obj }
console.log(vodeoObj)
//设置对象默认值
let obj2 = { ...obj , name: 'jeck'}
console.log(obj2)
//合并对象
let obj3 = { ...obj, ...initObj}
console.log(obj3)
//坑点
//简单类型的时候,使用扩展运算符是没问题的,但是如果扩展运算符展开对象以后,还是对象的话,我们复制的只是一个指针
}
{
//属性初始化的简写 和 对象⽅法的简写
let name = '小明'
let age = 18
let es5Obj = {
name: name,
age: age,
sayHello:function(){
console.log('this is es5Obj')
}
}
let es6Obj ={
name,
age,
sayHello(){
console.log('this is es6Obj')
}
}
console.log('es5',es5Obj)
console.log('es6',es6Obj)
es5Obj.sayHello()
es6Obj.sayHello()
}
{
//可计算的属性名
let key = 'name'
let es5Obj = {}
es5Obj[key] = 'Tom'
let es6Obj = {
[key]:'jeck'
}
console.log(es5Obj , es6Obj)
}
{
//新增⽅法
//Object.is() 和 '==='
let result = Object.is(NaN,NaN)
console.log(result)
console.log(NaN===NaN)
//Object.assign()
const preson = { name:'小米', age:'18', info:{ height:'180cm'}}
let preson2 = {}
Object.assign(preson2,preson)
//console.log(preson2)
preson.info.height = '170cm'
console.log(preson2)
//这里的全复制 复制的是指针
//Array.from 类数组对象 有length 可遍历
const str = 'hello'
const strList = Array.from(str)
console.log(strList)
//Object.keys() Object.values() Object.entries()
const json = { name:'Nick', video:'ES6', date:2019 }
let obj = {}
// for ( const key of Object.keys(json)){
// obj[key] = json[key]
// }
// console.log(obj)
for (const value of Object.values(json)){
obj = value
console.log(obj)
}
}
效果图: