javascript迭代方法
分类专栏: Javascript&
简介 认识javascript中可迭代和不可迭代的方法。&
<p><span style="line-height: 1.5;">不生成新数组的迭代器方法:</span></p>
<p><span style="line-height: 1.5;"><code>function square(num) {</code></span></p>
<p><span style="line-height: 1.5;"><code> console.log("num", num * num);</code></span></p>
<p><span style="line-height: 1.5;"><code>}</code></span></p>
<p> </p>
<p><span style="line-height: 1.5;"><code>var nums = [1,2,3,4,5,6,7,8,9,10];</code></span></p>
<p><span style="line-height: 1.5;"><code>nums.forEach(square);</code></span></p>
<p> </p>
<p><span style="line-height: 1.5;">另一个迭代器方法是every(),该方法接受一个返回值为布尔类型的函数。</span></p>
<p><span style="line-height: 1.5;">例子:</span></p>
<p><span style="line-height: 1.5;">const isEven = (num) => num % 2 == 0;</span></p>
<p> </p>
<p><span style="line-height: 1.5;">var nums = [2,4,6,8,10];</span></p>
<p><span style="line-height: 1.5;">var even = nums.every(isEven);</span></p>
<p><span style="line-height: 1.5;">if (even) {</span></p>
<p><span style="line-height: 1.5;"> console.log("all numbers are even");</span></p>
<p><span style="line-height: 1.5;">} else {</span></p>
<p><span style="line-height: 1.5;"> console.log("not all numbers are even");</span></p>
<p><span style="line-height: 1.5;">}</span></p>
<p><span style="line-height: 1.5;">some() 方法也接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回 true, 该方法就返回 true。</span></p>
<p><span style="line-height: 1.5;">reduce() 方法接受一个函数,返回一个值。该方法会从一个累加值开始,不断对累加值和 数组中的后续元素调用该函数,直到数组中的最后一个元素,最后返回得到的累加值。</span></p>
<p> </p>
<p><code><span style="line-height: 1.5;">function add(runningTotal, currentValue) {
return runningTotal + currentValue;
}
</span></code></p>
<p><code><span style="line-height: 1.5;">var nums = [1,2,3,4,5,6,7,8,9,10];
</span></code></p>
<p><code><span style="line-height: 1.5;">var sum = nums.reduce(add);
</span></code></p>
<p><code><span style="line-height: 1.5;">print(sum); // 显示 55</span></code></p>
<p> </p>
<p>reduce() 方法和 add() 函数一起,从左到右,依次对数组中的元素求和,其执行过程如下 所示:</p>
<p><code><span style="line-height: 1.5;">add(1,2) -> 3
</span></code></p>
<p><code><span style="line-height: 1.5;">add(3,3) -> 6
</span></code></p>
<p><code><span style="line-height: 1.5;">add(6,4) -> 10
</span></code></p>
<p><code><span style="line-height: 1.5;">add(10,5) -> 15
</span></code></p>
<p><code><span style="line-height: 1.5;">add(15,6) -> 21
</span></code></p>
<p><code><span style="line-height: 1.5;">add(21,7) -> 28
</span></code></p>
<p><code><span style="line-height: 1.5;">add(28,8) -> 36
</span></code></p>
<p><code><span style="line-height: 1.5;">add(36,9) -> 45
</span></code></p>
<p><code><span style="line-height: 1.5;">add(45,10) -> 55</span></code></p>
<p> </p>
<p> </p>
<p><span style="line-height: 1.5;">JavaScript 还提供了 reduceRight() 方法,和 reduce() 方法不同,它是从右到左执行。下面 的程序使用 reduceRight() 方法将数组中的元素进行翻转:</span></p>
<p><span style="line-height: 1.5;">function concat(accumulatedString, item) { return accumulatedString + item; } </span></p>
<p><span style="line-height: 1.5;">var words = ["the ", "quick ","brown ", "fox "]; </span></p>
<p><span style="line-height: 1.5;">var sentence = words.reduceRight(concat); </span></p>
<p><span style="line-height: 1.5;">print(sentence); // 显示 "fox brown quick the"</span></p>
<p> </p>&&
分享到:
转载:
喜欢 0
收藏
暂无评论信息
- 相关文章
- 文章推荐
-
HTML 面试知识点总结
本部分主要是笔者在复习 HTML 相关知识和一些相关面试题时所做的笔记,如果出现错误,希望大家指出!
-
docker搭建jenkins环境执行宿主机的docker无权限的解决方法
初次搭建jenkins持续集成工具的时候,在运行项目阶段出现 permission denied的情况
-
眼镜试戴的装饰效果
开发眼镜类产品的时候需要使用试戴的功能,这里就有你需要的学习资料哦!
-
jQuery 3.0正式发布
jQuery 基金会刚刚发布了该 Java 框架的 3.0 版本,并且首次抛弃了对老旧的 IE 浏览器的支持。jQuery 3.0 的工作始于 2014 年 10 月,其最初目标是在 2.0 版本之上进行完善,并和遥远的 1.0 版代码说再见——因为要兼容 IE 的缘故,其已经臃肿不堪。jQuery 2.0 已经与 1.0 版本完全不兼容,而 3.0 也将继续这一路线。
- 点击排行
- 站长推荐
- 猜你喜欢
- 网站信息
- 站内问答:12篇
- 站内文章:213篇
- 建站时间:已运行1245天
- 备案号: 浙ICP备2022018799号
- 语言:
- English(USA)
- French(FR)
- Chinese(ZH)
无数据