ES6-05:数组的扩展

ES6对于JavaScript数组对象的扩展,主要是为了增强数组的创建及元素的操作方法;具体来说即一个运算符、数组创建方法、数组元素操作方法、数组属性操作方法四个方面;

1.增加一个运算符——扩展运算符...

扩展运算符(spread):如同rest参数的逆运算,将一个数组转换成用逗号分隔的序列,扩展运算符内部调用的是数据结构的Interator接口,因此,主要有Iterator接口的对象,,都可以使用扩展运算符;可替代apply方法;

console.log(...[1,2,3]);//1 2 3
console.log(1,...[2,3,4],5); // 1 2 3 4 5
let a=[1,2,3];
let b=[1,2,3];
a.push([4,5]); // [1,2,3,[4,5]]
b.push(...[4,5]);//[1,2,3,4,5]

2. 新增创建方法

  • Array.from(obj):将类数组对象(具有length属性)、可遍历对象(包括 Set/Map)转换成真正的数组;
  • Array.of(arugs):将一组值转换为数组,如:Array.of(3);//[3]Array.of(1,2,3);//[1,2,3];
  • Array.fill(value,startIndex,endIndex):用指定值value来填充数组中指定位置值,若没有第二、第三个参数,则填充数组中所有空值元素;

3. 新增元素操作方法

  • Array.copyWithin(targetIndex,startIndex=0,endIndex):将当前数组内部制定位置成员复制到其他位置(覆盖原值),返回新数组,会改变当前数组;
  • Array.find(fn(value,index,arr){},thisObj):找出数组中第一个符合条件的成员,若找到,返回true,否则返回false;
  • Array.findIndex(fn(value,index,arr){},thisObj):找出数组中第一个符合条件的成员,若找到,返回index,否则返回-1;
  • Array.includes(value,startIndex):从数组中指定位置开始,查看数组中是否包含元素value;

4.新增数组属性方法:

  • Array.keys():获取数组中所有的键名,返回一个遍历器对象;
  • Array.values():获取数组中所有的值,返回一个遍历器对象;
  • Array.entries():获取数组中所有的键值对,返回一个遍历器对象;[]

PS:ES6 中对数组中的空位元素,统一处理成undefined;而ES5对空位处理:①map()跳过空位,但保留值;②forEach()、filter()、every()、some()都会跳过空位;③join()、toString()将空位视为undefined,而undefined、null处理成空字符串;

时间: 2024-10-17 07:47:20

ES6-05:数组的扩展的相关文章

ES6对数组的扩展

ECMAScript6对数组进行了扩展,为数组Array构造函数添加了from().of()等静态方法,也为数组实例添加了find().findIndex()等方法.下面一起来看一下这些方法的用法. Array.from() Array.from()将类数组(array-like)对象与可遍历的对象转化为数组并返回.例如将dom节点集合转化为数组,以前我们可能都会这样写: var divs = document.querySelectAll("div"); [].slice.call(

ES6 丨数组的扩展

一.扩展运算符(...) 1.数组复制(不是新数组) const a1 = [4, 5, 6, 7] const a2 = a1 a2[0] = 666 console.log('a1', a1) //[666, 5, 6, 7] 上面的示例,只是复制了指向底层数据结构的指针,而不是克隆一个全新的数组. a2并不是a1的克隆,而是指向同一份数据的另一个指针.修改a2,会直接导致a1的变化. 2.克隆新数组 ES5的写法(只能用变通方法来复制数组) const a1 = ['a', 'b', 'c

ES6对于数组的扩展

扩展运算符(...),用于将数组转化为逗号分隔的参数序列. ...实现数组的拷贝: 数组是一维数组时,扩展运算符可以深拷贝一个数组(对象同理): let arr = [1, 2, 3, 4, 5, 6]; let arr1 = [...arr]; arr == arr1 // false 当数组为多维时,数组中的数组变成浅拷贝(对象同理): let arr = [1, 2, 3, 4, 5, 6, [1, 2, 3]]; let arr1 = [...arr]; arr1.push(7); ar

ES6标准学习: 4、数组的扩展

数组的扩展 一.类数组对象与可遍历对象转换为数组 Array.from()方法用于将类数组对象.可遍历对象转换为数组,其中可遍历对象包括es6新增的set和map结构 所谓的类数组对象,本质特征是必须拥有length属性 1 let arrayLikeObj = { 2 '0': 'a', 3 '1': 'b', 4 '2': 'c', 5 length: 3 6 } 7 8 ES5转换为数组: 9 let arr = [].slice.call(arrayLikeObj) // ['a', '

数组的复制及ES6数组的扩展

一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只能用变通方法来复制数组. const a1 = [1, 2]; const a2 = a1.concat(); a2[0] = 2; a1 // [1, 2] //使用ES6语法会防止这种现象出现 const a1 = [1, 2]; // 写法一 const a2 = [...a1]; // 写法

ES6小实验-数组的扩展

数组方法已经很多,ES6给数组又增加了不少方法: 1.Array.from():用于将两类对象转为真正的数组,类似数组的对象(array-like object) 和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map) let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length:3 } let arr = Array.from(arrayLike) console.log(arr)//["a", "b&q

ES6--字符串、正则、数值、数组的扩展

三.字符串的扩展 字符编码 JavaScript内部,字符以UTF-16的格式储存,每个字符固定为2个字节.对于那些需要4个字节储存的字符(Unicode码点大于0xFFFF的字符),JavaScript会认为它们是两个字符.然而汉字往往就是4个字节存储,ES6之前处理起来有些麻烦. 示例:字符编码 var ChineseName = "李刚"; var EnglishName = "ligang"; ChineseName.codePointAt(1); // 0

ES6中数组的新方法

数组的扩展 1.1扩展运算符 1.1.1:... 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. <body> <div></div> <div></div> <div></div> <div></div> </body> <script type="text/javascript"> c

数组功能扩展--差集,并集,合集,去重

//数组功能扩展 Array.prototype.each = function(fn){       fn = fn || Function.K;        var a = [];        var args = Array.prototype.slice.call(arguments, 1);        for(var i = 0; i < this.length; i++){            var res = fn.apply(this,[this[i],i].conc

ES6定型数组

前面的话 定型数组是一种用于处理数值类型(正如其名,不是所有类型)数据的专用数组,最早是在WebGL中使用的,WebGL是OpenGL ES 2.0的移植版,在Web 页面中通过 <canvas> 元素来呈现它.定型数组也被一同移植而来,其可为JS提供快速的按位运算.本文将详细介绍ES6定型数组 概述 在JS中,数字是以64位浮点格式存储的,并按需转换为32位整数,所以算术运算非常慢,无法满足WebGL的需求.因此在ES6中引入定型数组来解决这个问题,并提供更高性能的算术运算.所谓定型数组,就