[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 ...
随机推荐
- C++拾遗（三）关于复合类型
数组相关 初始化只能在定义的时候使用,不能把数组赋给另一个数组. 初始化可以提供比元素数目少的初值,其它元素将被置为0. 字符char数组只有在以\0结尾时才是一个字符串.sizeof()返回数组的长 ...
- C++ 实现网络爬虫
吐槽 前天心血来潮, 把自己面试经历下了下来. 我觉得自己求职一路来比较心酸, 也付出了比一般人更多的汗水. 本以为写出来, 好歹可以作为一篇励志故事. 得到的评论却是, 语言只是一门工具. ||| ...
- Qt信号槽连接在有默认形参下的情况思考
写下这个给自己备忘,比如函数 ) 你在调用端如论是test(3)或者test(),都可以正确调用到这个函数. 但是,如果放到Qt中的信号槽的话,这个还是值得讲一讲的,不然的话,可能会引起相应的误会. ...
- 3 Longest Substring Without Repeating Characters(最长不重复连续子串Medium)
题目意思:求字符串中,最长不重复连续子串 思路:使用hashmap,发现unordered_map会比map快,设置一个起始位置,计算长度时,去减起始位置的值 eg:a,b,c,d,e,c,b,a,e ...
- javascript mvc 简单例子
<!DOCTYPE html> <html> <head> </head> <body> <input type="text ...
- Tinkphp定时发布文章的教程
第一步:在文章表中加一个字段,用来保存定时发布的时间 假定我把这个字段设为 push_time 默认为 0 第二步:写一个方法来检查文章列表,把文章列表到时间的文章改为发布状态 //定时发布文章 pu ...
- 【新手--android日记】实现IOS风格电话界面
[前言--新手日记] 开始学习android开发,通过做一个通讯录练习,打算实现各种自己想实现的功能. 新手作品,技术含量很浅.主要是记录自己的学习过程. 纯学习之用,求评论,求建议,求教导. [正题 ...
- python中read、readline和readlines的区别
read 读取整个文件 readline 读取下一行 readlines 读取整个文件到一个迭代器以供我们遍历(读取到一个list中,以供使用,比较方便). 123.txt内容 ...
- ajax切换明星头像！
html部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- spinner 下拉框控件
spinnerMode=dropdown时,为下拉模式spinnerMode=dialog时,会在界面中间弹出Android:popupBackground=”#f0000000”,可以去除spinn ...