[ES6] Converting an array-like object into an Array with Array.from()
Array.from() lets you convert an "iterable" object (AKA an array-like object) to an array. In this lesson, we go over grabbing DOM nodes and turing them into an array so that we can use methods like Array.filter() and Array.forEach()on them.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Array.from() example</title>
</head>
<body>
<ul>
<li class="product">15.99</li>
<li class="product">7.99</li>
<li class="product">32.99</li>
<li class="product">24.99</li>
<li class="product">5.99</li>
</ul>
</body>
<script src="./index.js"></script>
</html>
const products =
Array.from(document.querySelectorAll('.product')); products
.filter(product => parseFloat(product.innerHTML) < 10)
.forEach(product => product.style.color = 'red');
What we got from document,querySelectorAll('.product') is 'NodeList', it is an array-like type, but cannot apply .filter, .map, .forEach to it. SO we use Array.from() method to convert is.
[ES6] Converting an array-like object into an Array with Array.from()的更多相关文章
- array to object
array to object native js & ES6 https://stackoverflow.com/questions/4215737/convert-array-to-obj ...
- Poco::JSON::Array 中object 设置preserveInsertionOrder 时,stringify出错-->深入解析
在使用poco version 1.6.0时 Poco::JSON::Array 在object 设置preserveInsertionOrder =true 时 调用 array.stringif ...
- Javascript中判断变量是 array还是object（是数组还是对象）
段文字是从github上截取由本人翻译过来的. 原文地址:https://github.com/nathansmith/javascript-quiz/blob/master/ANSWERS.md 怎 ...
- PHP“Cannot use object of type stdClass as array” (php在调用json_decode从字符串对象生成json对象时的报错)
php再调用json_decode从字符串对象生成json对象时,如果使用[]操作符取数据,会得到下面的错误 错误:Cannot use object of type stdClass as arra ...
- PHP json_decode object时报错Cannot use object of type stdClass as array
PHP json_decode object时报错Cannot use object of type stdClass as array php再调用json_decode从字符串对象生成json对象 ...
- typeof升级版，可以识别出array、object、null、nan、[]、{}
typeof 经常混淆array.object.null等,升级处理一下. 可以将这个函数放在common.js中使用. function getTypeName(v) { var v_str = J ...
- 将类数组对象(array-like object)转化为数组对象(Array object)
用法:Array.prototype.slice.call(array-like object) // 创建一个类数组对象 var alo = {0:"a", 1:"b& ...
- 不要将 Array、Object 等类型指定给 prototype
在 JavaScript 中,注意不要将 Array.Object 等类型指定给 prototype,除非您的应用需要那么做.先观察如下代码: function Foo(){}Foo.prototyp ...
- AFNetworking 关于JSON text did not start with array or object and option to allow fragments not set 错误
AFHTTPSessionManager *manager =[AFHTTPSessionManager manager]; [manager GET:@"http://www.baidu. ...
- js 判断值为Array or Object的方法
①obj instanceof Array / Object ②Array.prototype.isPrototypeOf(obj) ③Object.prototype.toString.call(o ...
随机推荐
- asp.net上传文件并创建文件夹和删除文件
上传文件部分代码: /// <summary> /// 上传保存文件并返回文件的保存地址和文件名称 /// </summary> /// <param name=&quo ...
- android - 模拟器连接本地tomcat
在使用android真机试图连接本地的tomcat的时候,发现一直没有反应.网上搜了很多资料,加上自己不断测试,后来发现模拟器访问tomcat的时候,ip的概念跟在pc上访问tomcat用的ip,根本 ...
- tomcat报404
很久没有用eclipse了,尝试了使用下,竟然将简单的配置tomcat都忘了. 自己新建一个工程,在tomcat发布以后,报404,经查Serves下的web.xml中,欢迎页面是index.jsp, ...
- C#异常处理表、类、SQL
表SQL /****** Object: Table [dbo].[IError] Script Date: 09/05/2012 17:00:41 ******/ SET ANSI_NULLS ON ...
- DbProviderFactories.GetFactory Oracle.ManagedDataAccess.Client
因为最近项目,要使用微软的EF框架不安装Oracle客户端的情况下,访问Oracle数据库.调用如下代码的时候会报错. System.Data.Common.DbProviderFactories.G ...
- 从服务器将Oracle数据库导出到本地Oracle数据库的方法
1.将服务器上的Oracle数据库导入到本地 在CMD模式下执行以下命令: exp username1/password@服务器端数据库 file=本地硬盘:/文件名.dmp 例如: exp ...
- 抓取锁的sql语句-第三次修改
CREATE OR REPLACE PROCEDURE SOLVE_LOCK AS V_SQL VARCHAR2(3000); --定义 v_sql 接受抓取锁的sql语句CUR_LOCK SYS_R ...
- Hibernate 一对多双向关联Demo
以Classes[班级]和Student[学生]为例的Demo //Classes.java public class Classes implements Serializable { privat ...
- When Colon Scripting is comming
当冒号脚本来临-- 前一篇<JSON带来编程界怎样的描述>,已经展开了一种脚本设计概念,以此诞生的脚本语言待定义的语法不多.但总归需要经历各种语言描述能力对比来归纳最终友好特性的. 冒号已 ...
- Uncaught SyntaxError: Unexpected end of input
js报错 原因:输入的意外终止…… 页面代码写的不规范啊……其中的某条语句,没有正常结束…… 或者部分语句“‘’”双引号,单引号没有配对好,被转义了之类的……错误造成的 代码: <script ...