es6中Array.from()和数组去重

Array.from()

1.复制数组,如果传的是数组,将把数组复制一份传给新数组。

let arr = [1,2,3,4,5];
let arr2 = Array.from(arr);
console.log(arr)        // [1,2,3,4,5]
console.log(arr2)        // [1,2,3,4,5]

2.如果是伪数组,将会转成数组在赋给新数组。

// html代码
<ul>
    <li>1111</li>
    <li>2222</li>
    <li>3333</li>
    <li>4444</li>
    <li>5555</li>
</ul>
// script代码
let oli = document.querySelectorAll("li");

console.log(oli);   //NodeList(5) [li, li, li, li, li]

let arr2 = Array.from(oli);

console.log(arr2);  //(5) [li, li, li, li, li] 

 2.1 用...扩展运算符也是可以的

let arr3 = [...oli];

console.log(arr3);  //(5) [li, li, li, li, li]

3.利用Array.from() 可以将Unicode编码拆解成数组。

console.log(Array.from('\u6211\u7231\u6572\u4ee3\u7801')) 

//(5) ["我", "爱", "敲", "代", "码"]

4.转换json对象为数组

一个类数组对象必须要有length,他们的元素属性名必须是数值或者可以转换成数值的字符。注意:属性名代表了数组的索引号,如果没有这个索引号,转出来的数组中对应的元素就为空。

 4.1 如果对象不带length属性,那么转出来就是空数组。

let json = {
    0:"a",
    1:"b",
    2:"c",
    3:"zk",
    four:"4",
    5:"zs",
}

let arr = Array.from(json);

console.log(arr);    //[]

4.2 有length属性,空余的索引值将会是undefined

let json = {
    0:"a",
    1:"b",
    2:"c",
    3:"zk",
    four:"4",
    5:"zs",
    length:7,
}

let arr = Array.from(json);

console.log(arr);   //(7) ["a", "b", "c", "zk", undefined, "zs", undefined]

Array.from()接受三个参数

1.被转换的对象

2.mapFn 是一个map函数

3.this指向

示例:

map 函数 用来对转换中,每一个元素进行加工,并将加工后的结果作为结果数组的元素值。

let arr = [1,2,3,4,5];

let arr2 = Array.from(arr,(item) => { return item * 2})

// 上面的map函数实际上是给数组中的每个数值 * 2。

console.log(arr2)

数组去重 

Array.from() 里面部署了很多的接口对象

利用 set 可以实现数组去重。

let arr = [1,1,"six","six",null,null,undefined,undefined,false,false,true,true,"",""];

// new Set 是实现数组去重,
// Array.from()把去重之后转换成数组

let arr2 = Array.from(new Set(arr));

console.log(arr2);

兼容性

 IE 是完全不兼容的,使用的时候要小心,如果要兼容IE,请自行百度兼容性方法.

  • 6
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ES6Array.from()和Array.of()都是用于创建新数组的方法,但它们的功能和使用方式有所不同。 1. Array.from(): - Array.from()方法用于从类数组对象或可迭代对象创建一个新的数组实例。 - 它接受一个类数组对象或可迭代对象作为第一个参数,并可选地接受一个映射函数和一个上下文对象作为第二个和第三个参数。 - 它将类数组对象或可迭代对象的每个元素转换为数组的对应元素。 - 映射函数可以在转换过程对每个元素进行处理。 - 返回一个新的数组实例。 示例: ```javascript // 从字符串创建数组 const str = 'hello'; const arr = Array.from(str); console.log(arr); // ['h', 'e', 'l', 'l', 'o'] // 从集合创建数组 const set = new Set([1, 2, 3]); const arr2 = Array.from(set, num => num * 2); console.log(arr2); // [2, 4, 6] ``` 2. Array.of(): - Array.of()方法用于创建一个包含任意数量参数的新数组实例。 - 它接受任意数量的参数,并将这些参数作为数组的元素,返回一个新的数组实例。 - 它解决了使用Array构造函数创建单个元素数组时的一些问题。 示例: ```javascript const arr1 = Array.of(1, 2, 3, 4); console.log(arr1); // [1, 2, 3, 4] const arr2 = Array.of(5); console.log(arr2); // [5] const arr3 = Array.of(undefined); console.log(arr3); // [undefined] ``` 总结: - Array.from()方法用于从类数组对象或可迭代对象创建一个新数组,并提供映射功能。 - Array.of()方法用于创建一个包含任意数量参数的新数组实例。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值