快捷導(dǎo)航

React二維數(shù)組的幾種聲明和使用過程

更新時(shí)間：2025年07月16日 08:34:47 作者：魔猴瘋猿

React二維數(shù)組聲明需注意結(jié)構(gòu)與值的可變性,正確方法包括直接賦值或動(dòng)態(tài)初始化,避免使用const map=[[]]導(dǎo)致長(zhǎng)度固定,動(dòng)態(tài)擴(kuò)展時(shí)應(yīng)先定義一維數(shù)組再添加元素,確保數(shù)組大小可變

React二維數(shù)組的幾種聲明和使用

React中對(duì)二維數(shù)組的聲明和使用的方式有多種，其中存在一些常見的錯(cuò)誤使用情況。

例如const map=[[]] 這樣定義二維數(shù)組，本篇文章給大家解析一下react數(shù)組使用的正確方法和錯(cuò)誤使用的錯(cuò)誤原因。

如果我們要使用的二維數(shù)組是有默認(rèn)值的，那我們可以直接在聲明時(shí)賦值，例如這樣：

const map = [[1,2],[3,4],[5,6]];

這個(gè)map變量的值是可變的，但是它的結(jié)構(gòu)是不可變的，要修改它可以這樣寫：

map[0] = [1,2,3]

但是，如果我們這樣寫就會(huì)報(bào)錯(cuò)：

map[3] = [1,2,3]

因?yàn)槲覀儗?duì)map的定義初始化的時(shí)候，按照react的語法，只要值不為空，那么數(shù)組的大小就是不可變的，但是數(shù)組的值是可變的。所以我們給map[3]賦值，這個(gè)map[3]并不存在，map只有0到2三個(gè)值，就會(huì)報(bào)錯(cuò)。

但是對(duì)于map[0]，[1,2]是它的一個(gè)值，這個(gè)值可以被整體替換為 [1,2,3]，沒有問題。

按這個(gè)道理

如果我們這樣做也是會(huì)報(bào)數(shù)組溢出的：

map[3][4] = 1;

如果我們想要數(shù)組的大小動(dòng)態(tài)可變?cè)趺崔k呢，我們可以這樣來初始化：

const map = []

這里把map首先定義為一個(gè)數(shù)組，這個(gè)時(shí)候[]內(nèi)沒有值，就代表這是一個(gè)沒有初始值的數(shù)組，其數(shù)組大小不是0，而是不確定，可以動(dòng)態(tài)賦值，例如：

map[0] = []

這里我們給map加了一個(gè)0號(hào)元素，值也是一個(gè)不確定大小的未初始化數(shù)組，這個(gè)數(shù)組也可以被動(dòng)態(tài)添加值：

map[0] [0] = 1;

但是我們要注意，當(dāng)map[0]被賦值時(shí)，map的大小才會(huì)擴(kuò)展為1，如果沒有給map[0]賦值，直接給map[1]賦值時(shí)是不能成功的：

按照這個(gè)理論

如果我們要初始化一個(gè)動(dòng)態(tài)擴(kuò)展的二維數(shù)組，我們應(yīng)該這樣做：

const map = [];
//在使用時(shí)，動(dòng)態(tài)擴(kuò)展
for(var i=0;i<count;i++){
   map[i] = [];
}

我們要給map定義為一個(gè)一維數(shù)組，然后動(dòng)態(tài)添加數(shù)組元素作為其元素值。

注意，不能這樣寫：

const map = [[]];

看似定義了一個(gè)空的二維數(shù)組，實(shí)則不然，這個(gè)寫法的意思是定義了一個(gè)數(shù)組，數(shù)組中只有一個(gè)數(shù)組類型的元素，外層[]中的[]代表了一個(gè)元素，相當(dāng)于給了外層數(shù)組初始值，這個(gè)數(shù)組就不是動(dòng)態(tài)可擴(kuò)展的了，而是外層只能有一個(gè)元素，這時(shí)map[1]就是不存在也不可賦值的。