过去,我们使用各种各样的方法来将类似Array对象的东西(比如 arguments 和 NodeList) 转换成真的数值。比如下面这个:

基本上,这些东西我们都可以使用Array.prototype.slice.call()这样的方法将argumentsNodeList等转行成想要的形式。

如今,我们有了更直接的方法,直接将这些类数组的对象转化成真正的对象。

NodeList 转化成 Array

  1. var divs = Array.from(document.querySelectorAll('div'));
  2.  
  3. // Array[232] (every DIV on the page)

将 arguments 转化成 Array

  1. function something() {
  2. var args = Array.from(arguments);
  3.  
  4. // Array['yes', 1, {}]
  5. }
  6. something('yes', 1, {});

将 String 转化成 Array

  1. Array.from('JavaScript'); // 很像'JavaScript'.split('')
  2.  
  3. // ["J", "a", "v", "a", "S", "c", "r", "i", "p", "t"]

这些写法非常的简单清晰,不需再使用slice等间接方法!

原文地址:http://it.lindukj.cn/archives/1405

转 JavaScript里的数组转化新方法Array.From的更多相关文章

  1. 数组的新方法 forEach some filter findIndex

    forEach  some  filter  findIndex这些都属于数组的新方法,都会对数组中的每一项,进行遍历,执行相关的操作: 只不过在循环的时候有些不一样 参考资料:https://wan ...

  2. 用javascript得到客户端IP的新方法

    javascript得到客户端IP的新方法 很久以来,我都是经过http://fw.qq.com/ipaddress来得到客户端用户的IP,这个方法简单.快速.实用 . 我们调用它的写法是: < ...

  3. vue学习(十四) 条件搜索框动态查询表中数据 数组的新方法

    //html <div id="app"> <label> 名称搜索关键字: <input type="text" clasa=& ...

  4. ES6中数组的新方法

    数组的扩展 1.1扩展运算符 1.1.1:... 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. <body> < ...

  5. JavaScript字符串、数组、对象方法总结

    字符串方法 示例字符串: const str = "hello,kitty,hello,vue "; 一.基本方法 charAt(n) 返回指定索引的字符 charCodeAt(n ...

  6. JavaScript里处理数组的一些常用方法

    修改器方法: 1.pop() 方法从数组中删除最后一个元素 pop() 方法将删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值. let arr2 = ['zh ...

  7. JavaScript 中有关数组对象的方法

    JS 处理数组多种方法 js 中的数据类型分为两大类:原始类型和对象类型. 原始类型包括:数值.字符串.布尔值.null.undefined 对象类型包括:对象即是属性的集合,当然这里又两个特殊的对象 ...

  8. es5数组的新方法

    1.every方法 //逻辑判断返回值为一个Boolean值 every方法就是每一个返回函数的返回值都是true的时候,才为true,否则为false var arr=[1,2,5,88,5,555 ...

  9. JavaScript -- 常用的数组及字符串方法

    数组 var arr= new Array(); arr.push(); //在数组尾部添加一个元素,返回新的长度 *原数组发生变化 arr.pop(); //删除最后一个元素,返回的是被删除的元素 ...

随机推荐

  1. spring 3.1.13中新增的util @value注解,给类或方法注入值

    在spring 3.0以上版本中,可以通过使用@value,对一些如xxx.properties文件 ,进行键值对的注入,例子如下: 一.类变量注入 1 首先在applicationContext.x ...

  2. 数据库SQL优化大总结之 百万级数据库优化方案 【转载】

    网上关于SQL优化的教程很多,但是比较杂乱.近日有空整理了一下,写出来跟大家分享一下,其中有错误和不足的地方,还请大家纠正补充. 这篇文章我花费了大量的时间查找资料.修改.排版,希望大家阅读之后,感觉 ...

  3. validate 不校验的解决办法

    最近使用validate.js用于项目的表单校验,调了半天,怎么都不校验,仔细对照例子发现 例子中要校验的文本框除了ID外还有name属性,而我在做的时候没有name属性,到这里终于 看到了希望,把所 ...

  4. mysql 索引 笔记1

    #不同的存储引擎支持的索引类型也不一样 InnoDB 支持事务,支持行级别锁定,支持 B-tree.Full-text 等索引,不支持 Hash 索引: MyISAM 不支持事务,支持表级别锁定,支持 ...

  5. Luogu 3237 [HNOI2014]米特运输

    BZOJ 3573 发现当一个点的权值确定了,整棵树的权值也会随之确定,这个确定关系表现在根结点的总权值上,如果一个点$x$的权值为$v$,那么一步步向上跳后,到根节点的权值就会变成$x*$每一个点的 ...

  6. maven构建非法字符解决办法

    CI使用maven做版本构建时候碰到了一个问题,有个java源码始终编译报错,错误发生在文件第一行. 出错内容是: ***.java:[1,1] 非法字符: \65279 后面上网看了,原来是文件编码 ...

  7. Monkey进行压力测试定位问题分析

    Monkey测试的log分析,我们可以通过几个关键词来判断测试是否通过.   分析log方法一(粗糙一点): 1)Monkey finished打开LOG,查看log的最下端,是否有类似以下字段:## ...

  8. js原型链prototype与__proto__以及new表达式

    对象模型的细节 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Details_of_the_Object_Model

  9. 第18章-使用WebSocket和STOMP实现消息功能

    Spring 4.0为WebSocket通信提供了支持,包括: 发送和接收消息的低层级API: 发送和接收消息的高级API: 用来发送消息的模板: 支持SockJS,用来解决浏览器端.服务器以及代理不 ...

  10. Java 集合工具类---------- Collections类