Dreamer Dreamer
首页
  • 分类
  • 标签
  • 归档
关于
GitHub (opens new window)

lycpan233

白日梦想家
首页
  • 分类
  • 标签
  • 归档
关于
GitHub (opens new window)
  • Vue

  • JavaScript

    • JavaScript部分特殊值判断记录
    • JavaScript各遍历方法对比
    • 防抖函数 Debounce
    • JavaScript 手撕深拷贝
    • JavaScript位运算应用场景
    • 浅谈Cookie和Session的区别
    • js 快速创建二维数组并初始化
      • 涉及API
      • 一维数组
      • 二维数组
    • js 获取变量准确类型
  • 前端
  • JavaScript
lycpan233
2024-10-29
目录

js 快速创建二维数组并初始化

# 前言

笔者喜欢用 js 写 leetcode 偶尔需要初始化二维数组,后来找了一些有效的方式,但是踩了一些坑,遂记录一下相关实践。

结果前置,后面篇幅讲述详情:

  1. 初始化一维数组
const arr = new Array(n).fill(0);
1
  1. 初始化二维数组
const arr = Array.from({ length: n }, () => new Array(m).fill(0))
1

或者

const arr = new Array(n).fill(0).map(() => new Array(m).fill(0));
1

# 二维数组

# 涉及API

首先介绍几个 API:

  • new Array(num: number)

    Array 类的构造函数,可以创建一个长度为 n 的稀疏数组,元素全部为 undefined。

  • Array.prototype.fill(value: any)

    将 value 填充至数组。重点,当 value 是对象时,数组的每一项都会引用该元素。

  • Array.from(arrayLike)

    将可迭代对象和类数组对象,转为数组

# 一维数组

通过上文提到的API,就可以很方便的构造一个一维数组并初始化了,常用方法:

const arr = new Array(n).fill(0);
1
const arr = Array.from({ length: n }, () => 0);
1

# 二维数组

初始化二维数组的思想主要是在一维数组的基础上,进行嵌套,然后填充元素。 里面有个比较坑的点是 fill() 方法,它的元素引用的是同一个对象,所以要杜绝以下写法。

const arr = new Array(n).fill(new Array(m).fill(0)); // 错误示范
// 如果尝试给某个元素赋值,就会影响到其它行的元素
arr[0][0] = 1; // 此时 [i][0] 此列均为 1
1
2
3

还有另外一个坑,是采用 map() 方法时,map() 会过滤空元素。要知道我们 new Array(n) 出来的数组是稀疏数组。

const arr = new Array(n).map(() => new Array(m).fill(0)); // 错误示范
console.log(arr);// n 个空元素
1
2

因此创建二维数组,可以采用以下两种方法:

  • 填充稀疏数组后,再使用 map()
const arr = new Array(n).fill(0).map(() => new Array(m).fill(0));
1
  • 采用 Array.from() 方法
const arr = Array.from({ length: n }, () => new Array(m).fill(0))
1

# 相关链接

  • new Array (opens new window)

  • Array.from() (opens new window)

  • Array.prototype.fill() (opens new window)

  • Array.prototype.map() (opens new window)

编辑 (opens new window)
上次更新: 2025/04/15, 03:48:14
浅谈Cookie和Session的区别
js 获取变量准确类型

← 浅谈Cookie和Session的区别 js 获取变量准确类型→

最近更新
01
docker基础概念
02-26
02
js 获取变量准确类型
02-19
03
Mysql SQL 优化思路
02-18
更多文章>
Theme by Vdoing | Copyright © 2023-2025 Dreamer | MIT License
粤ICP备2025379918号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式