javascript中二维数组普遍实际操作的基本知识

lxf2023-03-21 09:06:02

本文为大家带来了有关javascript中二维数组普遍实际操作的基本知识,主要包括创建数组、分辨是否二维数组、类二维数组和数组变换及其数组去重的一些问题,希望能够帮到大家。

javascript中二维数组普遍实际操作的基本知识

相关信息:javascript学习教程

创建数组

创建数组是基本技能,其方式主要包含以下这些:

const arr = [1,2,3]                   
// 二维数组字面量const arr = [,,,]                     
// 三元素位置二维数组(hole array)const arr = new Array(4)              
// [,,,,]const arr = new Array(4,2)            
// [4,2]const arr = Array.of(1,2,3)           
// [1,2,3]

在其中,我们一般常用是二维数组字面量法。

分辨是否二维数组

分辨是否二维数组的办法主要包括:

// 方法一[1,2,3] instanceof Array   
// 方法二[1,2,3].constructor === Array
// 方式三Object.prototype.toString.call([1,2,3]) === '[object Array]'
// 方式四Array.isArray([1,2,3])
// 方式五(适配书写)function isArray(arr){
    return Array.isArray ? 
        Array.isArray(arr):Object.prototype.toString.call(arr) === '[object Array]'}

一般常用应当是 isArray 方式。

类二维数组和数组的转换

大家有时候遇到的算法设计并不是纯二维数组,一般将其归为“类二维数组”,类二维数组可以利用以下方法变为纯二维数组:

const x = document.querySelectorAll('a');
// 方法一Array.prototype.slice.call(x);
// 方法二Array.from(x);Array.from(x,mapFn,thisArg);
// 方式三[...x]
// 方式四function toArray(x){
    let res = []
    for(item of x){
        res.push(item)
    }
    return res}
    // 方式五Array.apply(null,x)
    // 方式六[].concat.apply([],x)

方式五和六本质上都是运用了 apply 的特征,即发送给 apply 的第二个主要参数(二维数组或是类二维数组)能被转换成一个参数列表,这种主要参数再送至调用的方式(new Array 或是 concat)中。

数组去重

数组去重,实质上都要较为2个原素是不是相同,假如相同,则抛下一个元素。为了能清晰地分辨,这儿统一应用 Object.is 进行对比。

1)运用 set 去重复

set 规定原素不能重复,因此将二维数组转换成 set 以后就可以去重复了,然后再变换回二维数组就可以。

function unique(arr){
    return Array.from(new Set(arr))
    // return [...new Set(arr)]}

2)双向循环系统 splice

表层循环遍历所有元素,内层循环遍历现阶段原素以后的所有元素,如果发现相同则运用 splice 移祛除一个。还记得内层循环系统每一次要返回一格,不然会遗漏掉一些原素

function unique(arr){
    for(let i = 0;i < arr.length;i  ){
        for(let j = i   1;i < arr.length;j  ){
            if(Object.is(arr[i],arr[j])){
                arr.splice(j,1)
                j--
            }
        }
    }
    return arr}

3)新创建二维数组 includes

新创建二维数组,每一次往二维数组中添加元素之前就查验二维数组中是不是已经有该原素:

function unique(arr){
    const res = []
    arr.forEach((item,index) => {
        // 还可以 if(res.indexOf(item) == -1),可是没法正确判断 NaN
        if(!res,includes(item)){
            res.push(item)
        }
    })}

4)reduce includes

function unique(arr){
    return arr.reduce((acc,cur) => {
        // return acc.includes(cur) ? acc : acc.concat(cur)
        return acc.includes(cur) ? acc : [...acc,cur]
    },[])}

5)新创建二维数组 sort

依据 sort 的制度(在每一个原素上启用 toStrng,随后在字符串数组方面进行筛选),让相同元素聚集在一起。新创建二维数组,每一次往二维数组中添加元素之前就查验该原素是不是相当于前边元素,是就属于反复原素:

function unique(arr){
    arr.sort()
    const res = [arr[0]]
    for(let i = 1;i < arr.length;i  ){
        if(!Object.is(arr[i],arr[i-1])){
            res.push(arr[i])
        }
    }
    return res}

6)新创建二维数组 运用对象属性

此方法其实跟“新创建二维数组 includes”一样。新创建二维数组,每一次往二维数组中添加元素之前就查验该原素是不是已经做为对象的属性:

// 对象属性值能够称之为原素重复频次function unique(arr){
    const res = []
    const obj = {}
    arr.forEach((item,index) => {
        if(!obj[item]){
            res.push(item)
            obj[item] = 1
        } else {
            obj[item]  
        }
    })
    return res}

这儿检验是指对象的属性名,而属性名本质上是一个字符串数组,因而会以为 obj[true]obj["true"]是相等,可能会导致原素 true 或是原素 "true" 无法放进新二维数组中

7)运用 map

实质跟上面的方法是一样的,但不必须新创建二维数组:

function unique(arr){
    let map = new Map()
    for(item of arr){
        if(!map.has(item)){
            map.set(item,true)
        }
    }
    return [...map.keys()]}

8)filter indexOf

除掉反复元素,换一个角度来讲就是保存这些检索相当于第一次出现时的检索元素,那样元素能用 filter 挑选出去,放到一个二维数组中:

function unique(arr){
    return arr.filter((item,index) => index === arr.indexOf(item))}

应用 indexOf 的主要缺点没法正确判断 NaN。

相关信息:javascript学习教程

以上就是关于心得分享JavaScript二维数组普遍操控的具体内容,大量欢迎关注AdminJS其他类似文章!