ES6之数组扩展

关键词:数组

array.form

我们知道document.getElementsByTagName获取的是一个集合,它有有长度,能遍历,但它不是纯粹的数组:

<body>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</body>
    var divs = document.getElementsByTagName('div');
    var div = [].slice.call(divs);
    console.dir(div);  //Array
    console.dir(divs); //HtmlCollection 

ES6提供了array.form方法把集合转为数组

    var eles = Array(divs); 
    console.log(eles);
    var eles = Array.from(divs);
    console.log(eles);   // [div, div, div, div, div, div]

array from不仅可以转集合,还可以转换字符串

    var str = "sdsdss";
    console.log(Array.from(str));   // ["s", "d", "s", "d", "s", "s"]
array.of

我们用new Array建立数组时候,如果只输入一个数据,数组会把它默认为长度

    var arr = new Array(5); 
    console.log(arr);   // [] length:5
    var arr = new Array(5,6,7);  // [5, 6, 7]
    console.log(arr);

这个时候用array.of就可以解决

  var arr = Array.of(5);
    console.log(arr);  //[5]
find()函数
    var arg = [1,2,3,4,5]
    var n = arg.find(function(value,index){
        return value > 3;  
    });
    console.log(n);      //4 
    var nn = arg.findIndex(function(value,index){
        return value > 3;  // 3
    });
    console.log(nn);    

如果数组是字符串会返回什么?

       var arg = ["小明","小强","小李","小王","小张"];
    var n = arg.find(function(value,index){
        return value > 3;  
    });
    console.log(n);   //undenfined
    var nn = arg.findIndex(function(value,index){
        return value > 3;  // 3
    });
    console.log(nn);     // -1
fill()函数

替换数组中对应区间的值
语法:fill ( range,start,end )

var rr = [8,8,8,8,8,8];
  rr.fill(6,2,5);  // [8, 8, 6, 6, 6 ,8]
  console.log(rr);
for...of

感觉就是个语法糖

  var arr = ["22","33","44","55"];
  for(var [key,value] of arr.entries()){
    console.log(key,value);
  }
  for(var key of arr.keys()){
    console.log(key);
  }
  for(var value of arr){
    console.log(value);
  }
// 返回结果
0 "22"
1 "33"
2 "44"
3 "55"
0
1
2
3
22
33
44
55
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第1章 认识JS JavaScript能做什么?1.增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)2.实现...
    mo默22阅读 1,326评论 0 5
  • 一、JS前言 (1)认识JS 也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HT...
    凛0_0阅读 2,798评论 0 8
  • 第1章 系好安全带,准备启航 1.1让你认识JS 1.1.1 JavaScript能做什么?增强页面动态效果(...
    张中华阅读 1,403评论 4 10
  • 进入主题 导入框架 在项目中导入Vendor 第三方框架 文件下的 CocoaLumberjack -日志框架...
    AlexLi_阅读 553评论 0 0
  • 2017年1月14日,分公司组织所辖项目的项目经理、技术负责人、施工员在分公司三楼会议室召开2016年年终工作总结...
    二直属工程部阅读 303评论 0 0