ECMA6-MCEA10部分新特性

本文详细介绍了ES6中的解构赋值、扩展运算符以及Symbol的作用。接着讲解了ES7中的includes方法,并展示了Set和Map数据结构的使用。此外,还涵盖了字符串和数组的各种遍历方式,以及对象和数组的去重。最后,提到了一些常用的字符串判断方法。通过这些特性,可以更高效地进行JavaScript编程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

//解构赋值
    let obj1 = { name: 'z', age: 26 }
    let { name,age } = obj1
    console.log(name,age) //z 26

    //...扩展运算符
    let obj2 = { name: 's', age: 25 }
    let arr2 = ['1','2','3']
    let obj3 = { ...obj2, sex: '女' }
    let arr3 = [...arr2, '4']
    console.log(obj3) //{ name: 's', age: 25, sex: '女' }
    console.log(arr3) //['1', '2', '3', '4']

    //Symbol(标识,常用于同一个键值,但是对应的值不等于时的情况)
    let obj4 = { 张三: { age: 14, hobby: 'running' }, 张三: { age: 20, hobby: 'reading' } }
    console.log(obj4) //{ 张三: { age: 20, hobby: 'reading' } }对象键值相同会被后面写的覆盖
    //此时z1不等于z2
    let z1 = Symbol('张三')
    let z2 = Symbol('张三')
    console.log(z1 === z2) //false
    let obj5 = { [z1]: { age: 14, hobby: 'running' }, [z2]: { age: 20, hobby: 'reading' } }
    console.log(obj5[z1]) //{ age: 14, hobby: 'running' }
    console.log(obj5[z2]) //{ age: 20, hobby: 'reading' }
    //symbol的其他api
    //此时s1等于s2
    let s1 = Symbol.for('s')
    let s2 = Symbol.for('s')
    console.log(s1 === s2) //true
    console.log(Symbol.keyFor(s1)) //   s  keyFor只能在定义时使用for才可以拿到值,不使用的话得到的是undefined
    //遍历具有symbol键值的对象
    for(let key of Object.getOwnPropertySymbols({ [s1]: 'sss' })) {
      console.log(key); //Symbol(s)
    }
    //可以同时遍历具有symbol键值和普通键值的对象
    for(let key of Reflect.ownKeys({ [s1]: '1', name: 'z' })) {
      console.log(key); //Symbol(s)、name
    }

    //遍历数组的方式
    let arr4 = [1,9,100,92,20]
    for(let i = 0; i < arr4.length;i++){}
    for(let key in arr4) {} //key为下标
    for(let value of arr4) {}
    arr4.forEach((item, index) =>{})
    arr4.filter((item) => item > 20) //常用于筛选
    arr4.map((item) => item*2) 

    //遍历对象键值的方式
    let obj6 = { name: 'z', age: 4, sex: '男' }
    for(let key in obj6) {}
    Object.keys(obj6).forEach((item) => {})
    Object.getOwnPropertyNames(obj6).forEach((item) => {})
    Reflect.ownKeys(obj6).forEach((item) => {})

    //es6新增特性Set,Set数组中的值是唯一的,可以用于去重
    let s3 = new Set([1,2,3])
    s3.add('zz') //新增元素
    s3.delete(1) //删除元素
    s3.has('zz')  //判断是否含有元素返回布尔值
    s3.size //s3的长度,与数组的length一样
    //遍历Set,key和value是一样的
    for(let key in s3.keys()) {}
    for(let key in s3.values()) {}
    for(let key in s3.entries()) {}
    let ws = new WeakSet() //此时ws的值只能是对象,且是弱引用,不能遍历
    const staticWs1 = { see: 100, ko: 'OK' }
    ws.add(staticWs1)
    ws.delete(staticWs1)
    //ws.forEach() 报错

    //es6新增特性Map
    let map1 = new Map([ ['name','z'],['age',26] ])
    map1.size//map1的长度,与数组的length一样
    map1.has('name') //判断是否含有元素返回布尔值
    map1.get('name') //获取值
    map1.set('name', 'zzzzz') //设置值
    for(let [key,value] of map1) {}
    for(let key of map1.keys()) {}
    for(let value of map1.values()) {}
    for(let [key,value] of map1.entries()) {}
    //也有WeakMap,但是key只能是引用数据类型(如object、array)

    //es6判断字符串的方法有indexOf()、includes()、startsWith()、endsWith()

    //es7新增includes()方法
    const arr5 = ['zzz', 'jjj', 'ddd'];
    console.log(arr5.includes('jjj',1)); // true,第二个值为开始寻找的索引也可以为负数,类似于slice

    const obj8 = {}
    //使用Reflect.defineProperty去设置obj8的值,可以设置对象上的一些属性
    Reflect.defineProperty(obj8, 'name', {
      value: 'zzz',
      writable: true,  //是否可以重写
      configurable: true, //是否可以删除
      enumerable: true //是否可以被遍历
    })

    //填充字符串
    const str1 = 'zzz'
    console.log(str1.padStart(5, 'jd')); //jdzzz
    console.log(str1.padEnd(5, 'jd')); //zzzjd
    const date = new Date();
    const year = date.getFullYear()
    const month = (date.getMonth() + 1).toString().padStart(2, '0')
    const day = date.getDate().toString().padStart(2, '0')
    console.log(`当前日期为${year}-${month}-${day}`); //当前日期为2022-08-25
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值