ES6 拓展总结

ES6除了我们熟知的箭头函数,模板字符串,函数声明等,近期在项目中发先了其他几个好用的新功能,总结一下:

1 includes()
类似ES5 中的 indexOf() 。但includes返回的是布尔类型, 而indexOf返回的是数值类型

          let arr = [1,2,3,4]
          arr.includes(2) //true
          arr.indexOf(2) //返回2 的index 1

如果数组中有NaN,你又正好需要判断数组是否有存在NaN,这时你使用indexOf是无法判断的,你必须使用includes这个方法。

          var ary1 = [NaN];
          console.log(ary1.indexOf(NaN))//-1
          console.log(ary1.includes(NaN))//true

当数组的有空的值的时候,includes会认为空的值是undefined,而indexOf不会。

        var ary1 = new Array(3);
        console.log(ary1.indexOf(undefined));//-1
        console.log(ary1.includes(undefined))//true

同时检测字符串的还有startWith 和endsWith() ,和includes()一样, 这三个均可传两个值,第一个是目标匹配的字符串,第二个是开始位置的index,endsWith()的index就是减去这个将搜索文本长度的位置开始正向匹配;

2 findIndex() 和 find()
这两个也是用于数组的
findIndex返回的是Index , find 返回的是value, 同时都是查找到第一个符合的后便返回;

            let targetIndex = out[signTesting.mainfile].findIndex((value, index, arr)=>{
              return value.pid == v.id
            })
          arr= [1, 5, 10, 15]
          arr.find(function(value, index, arr) {  
          return value > 9; }   //10
          arr.findIndex(function(value,index, arr)}{
          return value > 9}   //2

3 repeat()重复

           x.repeat(3)//xxx,传入num;

4.toFxied(num)这个其实不是ES6的方法,(又称四舍六入五留双)法

          var num = 5.56789;
          var n=num.toFixed(2);//5.57

简单来说就是:四舍六入五考虑,五后非零就进一,五后为零看奇偶,五前为偶应舍去,五前为奇要进一。
对于精度有其他要求的,可以研究下这个库
https://github.com/MikeMcl/bignumber.js

5.Object.is() ,类似于 “===”
但是 区别如下

            Object.is(+0,-0) //false, 
            +0 === -0//true,    
            Object.is(NaN,NaN)  //true, 
            NaN === NaN false
  1. Object.assign(), 对象拷贝(浅拷贝)

            var target = {a:1};
            var source1 = {b:2};
            var source2 = {c:3};
            Object.assign(target,source1,source2);
            console.log(target);//Object {a: 1, b: 2, c: 3}
    

注意: 对于这种嵌套的对象,一旦遇到同名属性,Object.assign的处理方法是替换,而不是添加。

  1. 对象遍历 Object.keys(), Object.values(), Object.entries()
    //ES5引入了Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键名。
    //Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值。
    //Object.entries方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组。
var obj = { foo: "bar", baz: 42 };
Object.keys(obj)
// ["foo", "baz"]

var obj = { foo: "bar", baz: 42 };
Object.values(obj)
// ["bar", 42]    


var obj = { foo: 'bar', baz: 42 };
Object.entries(obj)
// [ ["foo", "bar"], ["baz", 42] ]二维数组

6.Array.of()
Array.of() 基本上可以替代Array()或者new Array()
Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]

      Array.of() // []  
      Array.of(3) // [3]  
      Array.of(3, 11, 8) // [3,11,8]  

      Array.of(3).length // 1   
      Array.of(undefined) // [undefined]  
      var args = Array.from(arguments,(value)=> value+1)

8.Array.from()
ES6为Array增加了from函数用来将其他对象转换成数组

var args = Array.from(arguments);

9.fill(target, start, end) 和 copyWithin(target, start, end)
fill() 方法用于将一个固定值替换数组的元素。
fill(0,1,3) //这三个输分别是 替换值, 开始index, 不包含的结束index;

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。
target 必需。复制到指定目标索引位置。
start 必须。 元素复制的起始位置。
end 可选 。 元素截止的位置(不包括), 默认length。

此外, 模板字符串可以嵌套 this is ${ xiao ming's ${name}} ,标签模板;

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,711评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,932评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,770评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,799评论 1 271
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,697评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,069评论 1 276
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,535评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,200评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,353评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,290评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,331评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,020评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,610评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,694评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,927评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,330评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,904评论 2 341

推荐阅读更多精彩内容

  • 三,字符串扩展 3.1 Unicode表示法 ES6 做出了改进,只要将码点放入大括号,就能正确解读该字符。有了这...
    eastbaby阅读 1,505评论 0 8
  • 文章链接地址String类型 String对象的方法也可以在所有基本的字符串值中访问到,其中,继承的 valueO...
    前端精髓阅读 532评论 0 5
  • 一. 字符串的一些扩展 for...of遍历ES6为字符串添加了遍历器接口,似的字符串可以被for...of循环遍...
    我不叫奇奇阅读 407评论 0 0
  • 北方的秋天是一年中最美的季节。太阳不愠不火,气温不高不低,风儿不疾不徐,就连衣衫也是不厚不薄,恰到好处...
    李0527阅读 3,700评论 36 34
  • ScrollView 创建文档时间:2016.3.23-21:00作者:三月懒驴使用平台:Mac 简单例子 其实S...
    三月懒驴阅读 296评论 0 0