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", "c"]

如果把上面的length:3去掉,那么转化就失败,因为没有length属性,它就不是一个类似数组的对象了。Array.from()还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组

var arrayLike = {
    ‘0‘: 1,
    ‘1‘: 2,
    ‘2‘: 3,
    length: 3
};
var arr = Array.from(arrayLike, function (x) {
    return x * x;
});
console.log(arr);//[1, 4, 9]

2.Array.of():用于将一组值,转换为数组

let arr = Array.of(1,2,3)
console.log(arr)//[1, 2, 3]

3.Array.prototype.copyWithin():数组实例的copyWithin方法,在当前数组内部,将指定位置的成员复制到其他位置(会覆盖其他位置的原有成员),然后返回当前数组      

      Array.prototype.copyWithin(target,start = 0,end=this.length)

  它接受三个参数(1)target(必须):从该位置开始替换数据

         (2)start(可选):从该位置开始读取数据,默认为0

           (3)end(可选):到该位置前停止读取数据,默认等于数组长度

var arr = [5,4,3,2,1].copyWithin(0,3)
console.log(arr)//[2, 1, 3, 2, 1]

上面0是target,3是起始位置,end默认为数组长度

4.find():用于找出第一个符合条件的数组成员,它的参数是一个回调函数

var arr = [5, 4, 3, 2, 1].find(function (value, index, arr) {
  return value > 3;
});
console.log(arr); //5

5.findIndex(): 返回第一个符合条件的数组成员的位置

var arr = [5, 4, 3, 2, 1].findIndex(function (n) {
  return n > 3;
});
console.log(arr); //0

6.fill(): 使用定值,填充一个数组,可以接收第二个和第三个参数,用于指定填充的起始位置和结束位置,感觉ES6所加的方法比较适合数组的大规模改变,如果是少量的变动,用ES5的方法一样可以做到

var arr = [‘a‘,‘b‘,‘c‘].fill(7,1,2)
console.log(arr)//["a", 7, "c"]

7.entries(),keys(),values() :用于遍历数组,它们都返回一个遍历器对象,keys是对键名的遍历,values()是对键值的遍历,entries()是对键值对的遍历,实验了下却发现chrome并不认识values()这个方法,其他两个都认识

for(let index of [‘a‘,‘b‘].keys()) {
    console.log(index)
}
//0
//1
 for(let elem of [‘a‘,‘b‘].values()) {
    console.log(elem)
}
//?
for(let [index, elem] of [‘a‘, ‘b‘].entries()) {
    console.log(index, elem)
}
//0 "a"
//1 "b"

8.includes() 返回一个布尔值,表示某个数组是否包含给定的值,它可以接受第二个参数表示搜索的起始位置,默认为0

console.log([1,2,3].includes(2))//true
console.log([1,2,3].includes(4))//false
时间: 2024-08-04 14:47:13

ES6小实验-数组的扩展的相关文章

ES6小实验-字符串的扩展

ES6里面的对字符串的扩展实际上就是增加了一些方法,使对字符串的操作更加完善,下面做几个小实验来验证下: includes(): 返回布尔值,表示是否找到了参数字符串,支持第二的参数,表示开始的位置 'use strict'; var s = 'Hello world!'; console.log(s.includes('Hello'));//true startsWith(): 返回布尔值,表示参数字符串是否在源字符串的头部,支持第二的参数,表示开始的位置 'use strict'; var

ES6小实验-函数的扩展

函数参数默认值 ES6允许为函数的参数直接设置默认值,即直接写在参数定义的后面 function log (x, y = "world") { console.log(x, y) } log("Hello")//Hello world 上面代码中,y是默认声明的,参数默认值可以与解构赋值的默认值,结合使用 function log ({x, y = "world"}) { console.log(x, y) } log({x: "Hel

ES6小实验-let和const(2)

继续小实验,上次写到块级作用域,那么为什么需要块级作用域呢?书中给了两个场景: 1.没有块级作用域,内层变量可能会覆盖外层变量.举例: var tmp = new Date() function f() { console.log(tmp) if(false) { var tmp = "hello world" } } f();//undefined 内层的tmp变量把外层的tmp变量覆盖,所以输出结果为undefined 2.用来计数的循环变量泄露为全局变量,举例: var s =

ES6小实验-复习数组

ES6给数组添加了不少方法,我先把之前的方法总结一下: 1.Array.isArray():检测数组 var arr = ['a','b','c'] var str = 'abc' console.log(Array.isArray(arr))//true console.log(Array.isArray(str))//false 2.push():接收任意数量的参数,把它们逐个添加到数组末尾 var arr = ['a','b','c'] var item = arr.push('d','e

ES6中对数组的扩展

Array.from()方法用于将两类对象转为真正的数组:类似数组的对象和可遍历对象. php有种返回json长成:let arr1={0:'1',1:'a',2:'c'};ES6可以直接写成let arr2=Array.from(arr1);//['1','a','c'].ES5可以写成 var arr3=[].slice.call(arr1);感谢ES6吧. 只要是部署了Iterator接口的数据结构,Array.from都能将其转为数组.Array.from('hello')//[h,e,

ES6小实验-复习正则表达式

正则表达式总是记不住,这一次参考网上一篇的文章好好复习一遍 正则表达式构造函数(四种写法): var regex = new RegExp('xyz', 'i') var regex = new RegExp(/xyz/i) var regex = /xyz/i // ES6的写法.ES5在第一个参数是正则时,不允许此时使用第二个参数,会报错. // 返回的正则表达式会忽略原有的正则表达式的修饰符,只使用新指定的修饰符. // 下面代码返回”i”. new RegExp(/abc/ig, 'i'

ES6小实验-复习字符串

字符串用的很频繁,而它的方法也比较多,因此有必要好好的总结下. 1.字符串观赏方法 charAt() :访问字符串中的特定字符 var str = "hello world" console.log(str.charAt(1))//e 该方法接收一个参数,即基于0的字符位置, charCodeAt():访问字符串中的特定字符的字符编码 var str = "hello world" console.log(str.charCodeAt(1))//101 该方法和上面

ES6对数组的扩展

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

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', '