We can use the destructing and rest parameters at the same time when dealing with Array opration.

Example 1:

let [first, ...remainingUsers] = ["Sam", "Tyler", "Brook"];
addActiveUsers(first, remainingUsers); // "Sam", ["Tyler", "Brook"]

Example 2:

function buildTopicInfo(topic){
let title = `<h1>${topic.title}</h1>`;
let author = `<small>${topic.author}<small>`; return [title, author];
} let topic = getCurrentTopic();
let [topicTitle, topicAuthor] = buildTopicInfo(topic);

Example 4:

let topicId = currentTopic();
let activeUsers = ["Sam", "Tyler", "Brook"]; for( let user of activeUsers ){
notifyTopicReply(topicId, user);
}
  • for...of can only apply on the intereable object, like array, but not object

Example 5:

This code will report an type error, because for ... of can not be used for object.

let topicInfo = {
title: "New Features in JS",
replies: 19,
lastReplyFrom: "Tyler"
}; for(let [k, v] of topicInfo){
console.log(`${k} - ${v}`);
}

Example 6: Array.find()

let recentTopics = [
{
title: "Semi-colons: Good or Bad?",
isLocked: true
},
{
title: "New JavaScript Framework Released",
isLocked: true
},
{
title: "ES2015 - The Shape of JavaScript to Come",
isLocked: false
}
]; recentTopics.find( (topic)=> !topic.isLocked)

[ES6] Array -- Destructuring and Rest Parameters && for ..of && Arrat.find()的更多相关文章

  1. vue.js 进行初始化遇到的关于core-js的错误@core-js/modules/es6.array.find-index]

    D:\vuejselement\workSpace\zutnlp_platform_show>cnpm install --save core-js/modules/es6.array.find ...

  2. es5||es6 - array

    导航目录 /** * javascript - array * * ES5: * join() * push() * pop() * shift() * unshift() * sort() * re ...

  3. es6 Array.from + new Set 去重复

    // es6 set数据结构 生成一个数据集 里面的元素是唯一的 const items = new Set([1, 2, 3, 4, 5, 5, 5, 5]); // items 是个对象 item ...

  4. [ES6] 09. Destructuring Assignment -- 2

    Read More: http://es6.ruanyifeng.com/#docs/destructuring Array “模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值: Ex ...

  5. [ES6] Array.findIndex()

    In es5, you can use indexOf to get the index of one item in an array. In es6, you can use findIndex( ...

  6. IE 浏览器不支持 ES6 Array.from(new Set( )) SCRIPT438: 对象不支持“from”属性

    [转]解决老浏览器不支持ES6的方法 现象: Array.from(new Set( )) SCRIPT438: 对象不支持“from”属性或方法   解决方法: 安装babel 引入browser. ...

  7. [ES6] 08. Destructuring Assignment -- 1

    Here is the way you get value from an object: var obj = { color: "blue" } console.log(obj. ...

  8. es6 - array for-chrome

    // 去重复 Array.from(new Set([1, 1, 2, 3])); // [1, 2, 3] console.log(Array.from(new Set([1, 1, 2, 3])) ...

  9. 解决低版本chrome浏览器不支持es6 Array.find()

     if (!Array.prototype.find) {  Array.prototype.find = function(predicate) {    'use strict';    if ( ...

随机推荐

  1. HTTPS 部署简要指南

    许多Web开发者都知道SSL,但常见的情况是SSL没有完整地部署或者没有部署在它应该部署的地方.这篇关于何时及如何部署SSL的简要指南,将帮助你避免大多数常见错误. 要点 如果你有任何机密信息,或者你 ...

  2. window.location.href 和self.location的区别

    你从字面上就可以理解到 window 指的是当前窗口 而 self 指的是自己 在HTML 中 由于页面可以镶嵌页面 所以这2个就有了 区别 比如说 我有个页面A.HTML 里面嵌套了一个B.HTML ...

  3. div中英文无法自动换行的解决办法

    在一个设定好宽度的div中,当我们输入的中文文字长度超过了设定宽度时,会自动换到下一行.   但是,如果输入的是英文字母,那么,无论你div设定宽度为多少,英文字母都是不换行直接在同一行输出,导致di ...

  4. 方形布局SquareLayout

    public class SquareLayout extends RelativeLayout { public SquareLayout(Context context, AttributeSet ...

  5. j2ee开发中的“java容器”和“web容器”有什么区别?

    http://blog.csdn.net/zi_jun/article/details/7387259

  6. java2实用教程102小程序(分数计算和流水线计算

    import java.util.Scanner; public class test{ public static void main(String args[]){ Rational a=new ...

  7. 【转】常用背景色RGB数值

    [转自]http://blog.sina.com.cn/s/blog_8fc890a201013z8h.html

  8. intent.setFlags方法中参数值的含义

    intent.setFlags()方法中参数的含义 1.FLAG_ACTIVITY_NEW_TASK: 例如现在栈一的情况是:A    B   C(C位于栈顶),C通过intent跳转到D,并且这个I ...

  9. C++快速排序实现(quicksort)

    quicksort:分治思想. 分解:数组A[p, r)被划分成两个子数组A[pq) 和 A[q+1, r),使得A[pq)中的每个元素小于等于A[q], A[q]也小于A[q+1r)中的每个元素.q ...

  10. GitHub与VS2013完成项目管理

    https://github.com 程序员应该去注册一个账号的网站 1.创建一个仓库 登录你的github网站:找到新建一个仓库的入口 一些基本信息填写完毕后,点击创建,即可拥有一个仓库 2. 让V ...