使用ES5阵列方法和ES6生成器
Using ES5 array methods with ES6 generators
在ES6生成器中使用新的ES5数组函数的正确方法是什么?我是否必须先将可迭代项显式转换为数组,或者有更好的方法吗?例如:
function* range(low, high) {
var i = low;
while(i < high)
yield i++;
}
// Sum of numbers in range, doesn't work
console.log(range(0, 10).reduce((x,y) => x + y));
Generator函数返回Iterator对象。Iterator API不包括更高阶的Array方法,如map
、reduce
等,因此您需要构建一个中间Array(或使用像wu.js这样的库)
您可以使用spread运算符从(有限)迭代器简明地构建一个数组:
var sum = [...range(0, 10)].reduce((e, i) => e + i)
使用Array.from
:构建阵列
console.log(Array.from(range(0, 10)).reduce((x,y) => x + y));
Array.from
从可迭代项创建一个数组。看见https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from.
如果你想在不创建数组的情况下进行reduce,那么你最终需要做一些事情,比如:
var sum = 0;
for (e of range(0, 10)) sum += e;
由于Array.from
目前在Chrome上不工作,我需要另一种方法将迭代器转换为数组。
(当然你可以用polyfill填充)
function iterator2Array(iterator) {
var result = [];
for (var item in iterator) {
result.push(item)
}
return result;
}
出于类似的原因,我在Map的原型中添加了一个"toArray",这样我基本上将迭代器转换为Array,这样你就可以使用它的面向函数的方法;当然,数组中的每个项都将是一个[key,value]元组(与Map.entries()
中的完全相同)
if (!Map.prototype.toArray) {
/**
* Transforms a map into an Array of 'tuples' [[key, value], ...]
*/
Map.prototype.toArray = function () {
var result = [];
for (var item of this) {
result.push(item);
}
return result;
}
}
var m = new Map([[0, 0], ['a', 'A']]);
m.toArray()
然后您可以将其用作数组——不过请记住[key,value]方法!
m.toArray().map(
function(item, index, array) {
var key = item[0],
value = item[1];
console.log(key + ": " + value);
return value;
});
这将返回地图的值(好吧,当然不是超级有用的!)
如果你更喜欢一个看起来更标准的循环:
var i = iterator.entries(),
result = [],
value;
while (value = i.next().value) {
result.push(value);
}
相关文章:
- Unexpected Transpile ES6>ES5
- 有没有办法将包含 es6 的字符串转换为 es5
- 使用 Babel 将 ES6 模块转换为 ES5 AMD 模块,无法按预期工作
- 如何导入“;旧的“;ES6中的ES5代码
- 使用ES5阵列方法和ES6生成器
- 为什么我需要的库没有从ES6转换到ES5
- ES6 -- 导入 es5 文件
- 重构作为属性从 es5 传递到 es6 的函数
- 使用 ES5 和 ES6 将输入注入组件构造函数
- Sublime Text:JavaScript ES5 与 ES6 的不同片段
- 使用 babel 将 es6 转换为 es5,然后与 Browserify 捆绑
- 我可以在没有npm、VS、Node等的情况下为ES6-ES5进行Transpile吗
- 在ES6应用程序中对库源映射进行网络打包时出错,可在ES5应用程序中使用
- 为ES5或ES6中对象的嵌套属性简明定义Getter和Setter
- Javascript、CoffeeScript、TypeScript、ES5和ES6之间的关系
- 为什么我的webpack配置的es6版本会给我一个错误,而es5版本却没有;t
- ES6到ES5转发器
- ES6类与ES5类有多少不同
- 为什么浏览器需要一个polyfills文件,而我用babel编译ES6到ES5
- ES5模块在ES6中是否有单行类比?Exports = require('./inner.js') '