本章学习要点:

  1. 扩展运算符
  2. Array.from()
  3. Array.of()
  4. 数组实例的 copyWithin()
  5. 数组实例的 find() 和 findIndex()
  6. 数组实例的 fill()
  7. 数组实例的 entries(),keys() 和 values()
  8. 数组实例的 includes()
  9. 数组实例的 flat(),flatMap()
  10. 数组的空位

1、扩展运算符

含义:扩展运算符(spread)是三个点(...)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。

console.log(...[1, 2, 3])
// 1 2 3 console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5 [...document.querySelectorAll('div')]
// [<div>, <div>, <div>]

该运算符主要用于函数调用。

function add(x, y) {
return x + y;
} const numbers = [4, 38];
add(...numbers) //

上面代码中add(...numbers)是函数的调用,它使用了扩展运算符。该运算符将一个数组,变为参数序列。

扩展运算符后面还可以放置表达式。

let x = 0;
const arr = [
...(x > 0 ? ['a'] : []),
'b',
];
console.log(arr) // ["b"]

如果扩展运算符后面是一个空数组,则不产生任何效果。

[...[], 1]   // [1]

注意,扩展运算符如果放在括号中,JavaScript 引擎就会认为这是函数调用。如果这时不是函数调用,就会报错。

(...[1, 2])
// Uncaught SyntaxError: Unexpected number console.log((...[1, 2]))
// Uncaught SyntaxError: Unexpected number console.log(...[1, 2])
// 1 2

ES6 学习6 数组的扩展的更多相关文章

  1. ES6中对数组的扩展

    hello,大家好,我又来了.         前面讲了字符串和数值的扩展,今天要讲的是:数组的扩展.不知道大家能否跟得上这个节奏,你们在阅读中对讲解有存在疑惑,记得留言提出来,要真正地理解,否则白白 ...

  2. ES6-11学习笔记--数组的扩展

    类数组 / 伪数组 Array.from() Array.of() copyWithin() fill() includes()   类数组.伪数组例子: let divs = document.ge ...

  3. ES6学习之数组扩展

    扩展运算符(...将数组分割为用逗号分割的参数序列) console.log(...[1,2,3]) //1 2 3 可替换数组的apply写法: function test(x,y,z){ cons ...

  4. ES6(三)数组的扩展

    1.Array.form ES6中,Array.from = function(items,mapfn,thisArg) {  }   Array.from 用于将 类数组 和 可遍历对象(实现了It ...

  5. ES6学习笔记(二)——字符串扩展

    相信很多人也和我一样,不喜欢这样循规蹈矩的逐条去学习语法,很枯燥乏味.主要是这样学完一遍之后,没过一段时间就忘到九霄云外了.不如实际用到的时候研究它记得牢靠,所以我就整理成笔记,加深记忆的同时便于复习 ...

  6. ES6中的数组方法扩展

    上一篇文章小编简单介绍了在ES6中,一些常用的方法和一些简单的应用,在这篇文章中,小编将针对ES6中数组常用方法进行扩展,相信经过这篇文章之后,每一位小伙伴下班时间会有所提前,就算从原来的996变成9 ...

  7. JavaScript学习笔记--ES6学习(四) 字符串的扩展

    ES6对字符串进行了一些扩展,主要表现在对Unicode 大于\uFFFF的字符的处理上. 1. ES6中字符的Unicode表示方法 在ES5中,字符串的Unicode表示方法: \uxxxx . ...

  8. JavaScript学习笔记--ES6学习(五) 数值的扩展

    ES6 对于数值类型 (Number) 进行了一下扩展: 1.对于二进制和八进制提供了新的写法 ES6对于二进制和八进制的数值提供了新的写法,分别用0b (或者0B) 和0o (或者0o) 表示.例如 ...

  9. es6 学习四 数组的学习

    1. Array.from() 语法: Array.from(arrayLike[, mapFn[, thisArg]]) arrayLike 类数组对象 mapFn 如果指定了该参数,新数组中的每个 ...

随机推荐

  1. Webpack 学习记录之概念

    1 什么是webpack webpack是一个模块打包器,可以递归的构建一个依赖关系图,其中包含每个程序需要的每个模块,然后将所有模块打包成一个或多个bundle.他和其他的工具最大的不同在于他支持c ...

  2. Project Euler 31 1000-digit Fibonacci number( DP )

    题意:在无限硬币的情况下能组成200的方案数有多少个 思路:DP,设数组 dp[ n ] [ k ] 代表前 n 种硬币能够组成 k 元的方案数,那么就能得到 dp [ n ] [ k ] = dp ...

  3. ELO kernels 记录

    these kernel for discuss how to handle outliers in target values. 一:Ashish Gupta: 在16年6月到18年8月,激活卡的人 ...

  4. [CodeForces]981C Useful Decomposition

    李煜东dalao今天给我们讲课了QwQ ppt上一道题 英文题说一下题意吧,以后又看不懂了 将一棵树分割成多个简单路径,每个边只能在一条路径上,但至少有一个公共节点. 输出简单路径分割方法/No 由题 ...

  5. nmcli 静态方式添加IP地址

    [root@ansible02:/root] > ip a 1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state U ...

  6. django与mysql实现简单的增删查改

    模型定义 from django.db import models class Grades(models.Model): g_name = models.CharField(max_length=2 ...

  7. 常用前端布局,CSS技巧介绍

    常用前端布局,CSS技巧介绍 对前端常用布局的整理总结,并对其性能优劣,兼容等情况进行介绍 css常用技巧之可变大小正方形的绘制 1:若通过设置width为百分比的方式,则高度不能通过百分比来控制. ...

  8. Windows常用软件

    目录 Uninstall Tool FACapture Unlocker Uninstall Tool Uninstall Tool 这是一款可以彻底删除应用的软件,能连通注册表内容一起删除. FAC ...

  9. 工具-vscode使用

    1.智能感知 vscode使用DefinitelyTyped进行自动完成所以需要先安装tsd,命令: npm install -g tsd 安装完成后,首先安装node基本语法支持 tsd query ...

  10. cocos2d-x 3.0 经常使用对象的创建方式

    cocos2d-x 3.0 中全部对象差点儿都能够用create函数来创建,其它的创建方式也是有create函数衍生. 以下来介绍下create函数创建一般对象的方法,省得开发中常常忘记啥的. 1.精 ...