适用于小程序的 ES6

作者: a333661d6d6e | 来源:发表于2019-05-06 14:08 被阅读14次

    一、codePointAt

    JavaScript内部,字符以UTF-16的格式储存,每个字符固定为2个字节。对于那些需要4个字节储存的字符(Unicode码点大于0xFFFF的字符),JavaScript会认为它们是两个字符。

    ES6新增了完全支持UTF-16的方法codePointAt(),该方法接受编码单元的位置而非字符位置作为参数,返回与字符串中给定位置对应的码位,即一个整数值

    var text = "𠮷a" ;
    
    console.log(text.charCodeAt(0)); // 55362
    console.log(text.charCodeAt(1)); // 57271
    console.log(text.charCodeAt(2)); // 97
    
    console.log(text.codePointAt(0)); // 134071
    console.log(text.codePointAt(1)); // 57271
    console.log(text.codePointAt(2)); // 97  
    

    二、includes

    1. indexOf用来查找某个元素的位置,如果不存在就返回-1,但是不能判断是否有NaN的元素。

    2. Array.includes()函数判断是否包含某一元素,返回 true / false,不能定位元素,但是能判断 NaN。

    const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', NaN]
    console.log('%s', arr1.indexOf(NaN)) // -1
    console.log(arr1.includes('c')) // true
    console.log(arr1.includes('z')) // false
    console.log(arr1.includes(NaN))  // true  
    /在此我向大家推荐一个前端全栈开发交流圈:582735936  突破技术瓶颈,提升思维能力
    

    三、startsWith

    1. 确定字符串是否以指定字符串的字符开头,返回 true/false。注意:区分大小写!

    2. 接受两个参数:

    第一个参数,要在此字符串开头搜索的字符;

    第二个参数是指定从字符串开始的位置,默认从零开始

    四、endsWith

    1. 从字符串的末尾开始查找

    五、repeat

    1. 返回一个新字符串,表示将原字符串重复n次
    let str1='a';
    let str2=str1.repeat(3);
    console.log(str2)//aaa  
    

    六、String.fromCodePoint

    七、copyWithin

    1. 用于操作当前数组自身,用来把某些位置的元素复制并覆盖到其他位置上去。

    2. 该函数有三个参数:

    target:目的起始位置;

    start:复制源的起始位置,可以省略,可以是负数;

    end:复制源的结束位置,可以省略,可以是负数,实际结束位置是end-1。

    const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
    arr1.copyWithin(1, 3, 6)
    console.log('%s', JSON.stringify(arr1)) // [1,4,5,6,5,6,7,8,9,10,11]
      
    

    目标的位置不够的,能覆盖多少就覆盖多少

    const arr2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
    arr2.copyWithin(3)
    console.log('%s', JSON.stringify(arr2)) // [1,2,3,1,2,3,4,5,6,7,8]  
    

    start和end都可以是负数,负数表示从右边数过来第几个

    const arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
    arr3.copyWithin(3, -3, -2)
    console.log(JSON.stringify(arr3)) // [1,2,3,9,5,6,7,8,9,10,11]  
    

    八、find

    1. 查找目标元素,找到就返回该元素,找不到返回undefined
    const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
    var ret1 = arr1.find((value, index, arr) => { 
    return value > 4
    })
    var ret2 = arr1.find((value, index, arr) => { 
    return value > 14
    })
    console.log('%s', ret1) // 5
    console.log('%s', ret2) // undefined  
    /在此我向大家推荐一个前端全栈开发交流圈:582735936  突破技术瓶颈,提升思维能力
    

    九、findIndex

    1. 查找目标元素,找到就返回元素的位置,找不到就返回-1
    var ret3 = arr1.findIndex((value, index, arr) => { 
    return value > 4
    }) 
    var ret4 = arr1.findIndex((value, index, arr) => { 
    return value > 14
    })
    console.log('%s', ret3) // 4
    console.log('%s', ret4) // -1  
    

    十、fill

    1. 使用制定的元素填充数组

    2. 参数:

    value:填充值。

    start:填充起始位置,可以省略。

    end:填充结束位置,可以省略,实际结束位置是end-1。

    const arr1 = [1, 2, 3, 4, 5]
    arr1.fill(7)
    console.log(arr1) // [7, 7, 7, 7, 7]  
    

    十一、entries(),keys()和values() —— 用于遍历数组

    1. 区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历
    for (let index of ['a', 'b'].keys()) {
     console.log(index) // 0 1
    }  
    

    十二、Array.from

    1. 将对象转换成数组

    2. 条件:

    1)部署了Iterator接口的对象,比如:Set,Map,Array

    2)类数组对象,就是一个对象必须有length属性,没有length,转出来的就是空数组。

    转换map

    转换set

    转换字符串

    Array.from('hello world') // ["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]  
    
    Array.from('\u767d\u8272\u7684\u6d77') // ["白", "色", "的", "海"]  
    

    类数组对象

    Array.from({
      0: '0',
      1: '1',
      3: '3',
      length:4
    }) 
    // ["0", "1", undefined, "3"]  
    /在此我向大家推荐一个前端全栈开发交流圈:582735936  突破技术瓶颈,提升思维能力
    
    Array.from({
      0: 0,
      1: 1
    })
    // []  
    

    3. 参数:

    1)被转换的的对象。

    2)map函数。

    3)map函数中this指向的对象。

    let diObj = {
      handle: function(n){
        return n + 2
      }
    }
    Array.from(
      [1, 2, 3, 4, 5], 
      function (x){
        return this.handle(x)
      }, 
      diObj
    ) // [3, 4, 5, 6, 7]  
    

    十三、Array.of

    1. new Array()构造数组的时候,是有二意性的

    构造时,传一个参数,表示生成多大的数组。

    构造时,传多个参数,每个参数都是数组的一个元素。

    1. 将一个或多个值转换成数组 === new Array() 传多个参数 的情况

    结语

    感谢您的观看,如有不足之处,欢迎批评指正。
    获取资料👈👈👈
    本次给大家推荐一个免费的学习群,里面概括移动应用网站开发,css,html,webpack,vue node angular以及面试资源等。
    对web开发技术感兴趣的同学,欢迎加入Q群:👉👉👉582735936 👈👈👈,不管你是小白还是大牛我都欢迎,还有大牛整理的一套高效率学习路线和教程与您免费分享,同时每天更新视频资料。
    最后,祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。

    相关文章

      网友评论

        本文标题:适用于小程序的 ES6

        本文链接:https://www.haomeiwen.com/subject/zfnvnqtx.html