วิธีสร้างอาเรย์หลายมิติ


148

ทุกคนสามารถให้ตัวอย่าง / ตัวอย่างของ JavaScript ด้วยอาร์เรย์แบบหลายมิติได้หรือไม่ หวังว่าคุณจะช่วยได้เพราะฉันยังใหม่กับ JavaScript

เช่นเดียวกับเมื่อคุณป้อน 2 แถวและ 2 คอลัมน์ผลลัพธ์ของมันจะเป็น 2 แถวของอินพุตและ 2 คอลัมน์ของอินพุต

แบบนี้:

[input][input]                
[input][input]

2
คุณหมายถึงอะไรกับ 'อินพุต' <input>องค์ประกอบหรือเพียงแค่ตัวแปรบางอย่าง?
pimvdb

1
ใช่แล้ว .. <input type = "text">
SpitFire

สำหรับผู้ที่ต้องการสร้างอาร์เรย์หลายมิติด้วยขนาดและจำนวนมิติโดยพลการให้ตรวจสอบคำตอบนี้
Pimp Trizkit

คำตอบ:


318
var numeric = [
    ['input1','input2'],
    ['input3','input4']
];
numeric[0][0] == 'input1';
numeric[0][1] == 'input2';
numeric[1][0] == 'input3';
numeric[1][1] == 'input4';

var obj = {
    'row1' : {
        'key1' : 'input1',
        'key2' : 'input2'
    },
    'row2' : {
        'key3' : 'input3',
        'key4' : 'input4'
    }
};
obj.row1.key1 == 'input1';
obj.row1.key2 == 'input2';
obj.row2.key1 == 'input3';
obj.row2.key2 == 'input4';

var mixed = {
    'row1' : ['input1', 'inpu2'],
    'row2' : ['input3', 'input4']
};
mixed.row1[0] == 'input1';
mixed.row1[1] == 'input2';
mixed.row2[0] == 'input3';
mixed.row2[1] == 'input4';

http://jsfiddle.net/z4Un3/

และถ้าคุณต้องการเก็บองค์ประกอบ DOM:

var inputs = [
    [
        document.createElement('input'),
        document.createElement('input')
    ],
    [
        document.createElement('input'),
        document.createElement('input')
    ]
];
inputs[0][0].id = 'input1';
inputs[0][1].id = 'input2';
inputs[1][0].id = 'input3';
inputs[1][1].id = 'input4';

ไม่จริงแน่ใจว่ามีประโยชน์ข้างต้นจนกว่าคุณจะแนบองค์ประกอบ ด้านล่างอาจเป็นสิ่งที่คุณกำลังมองหา:

<input text="text" id="input5"/>
<input text="text" id="input6"/>
<input text="text" id="input7"/>
<input text="text" id="input8"/>    
var els = [
    [
        document.getElementById('input5'),
        document.getElementById('input6')
    ],
    [
        document.getElementById('input7'),
        document.getElementById('input8')
    ]
];    
els[0][0].id = 'input5';
els[0][1].id = 'input6';
els[1][0].id = 'input7';
els[1][1].id = 'input8';

http://jsfiddle.net/z4Un3/3/

หรืออาจจะ:

<input text="text" value="4" id="input5"/>
<input text="text" value="4" id="input6"/>
<br/>
<input text="text" value="2" id="input7"/>
<input text="text" value="4" id="input8"/>

var els = [
    [
        document.getElementById('input5'),
        document.getElementById('input6')
    ],
    [
        document.getElementById('input7'),
        document.getElementById('input8')
    ]
];

var result = [];

for (var i = 0; i < els.length; i++) {
    result[result.length] = els[0][i].value - els[1][i].value;
}

ซึ่งจะช่วยให้:

[2, 0]

ในคอนโซล หากคุณต้องการที่จะส่งออกไปที่ข้อความคุณสามารถresult.join(' ');ซึ่งจะให้คุณ2 0ที่จะให้คุณ

http://jsfiddle.net/z4Un3/6/

แก้ไข

และการสาธิตการทำงาน:

<input text="text" value="4" id="input5"/>
<input text="text" value="4" id="input6"/>
<br/>
<input text="text" value="2" id="input7"/>
<input text="text" value="4" id="input8"/>
<br/>
<input type="button" value="Add" onclick="add()"/>

// This would just go in a script block in the head
function add() {
    var els = [
        [
            document.getElementById('input5'),
            document.getElementById('input6')
        ],
        [
            document.getElementById('input7'),
            document.getElementById('input8')
        ]
    ];

    var result = [];

    for (var i = 0; i < els.length; i++) {
        result[result.length] = parseInt(els[0][i].value) - parseInt(els[1][i].value);
    }

    alert(result.join(' '));
}

http://jsfiddle.net/z4Un3/8/


1
ฉันจะรู้ได้อย่างไรว่างานนี้ได้อย่างไร .. ฉันสับสน Javascript
SpitFire

1
คุณสับสนเรื่องอะไร
Jared Farrish

เกี่ยวกับมันเป็นอย่างไรฉันจะสร้างไฟล์ HTML ที่มีสองอินพุตและเป็นอินพุตของแถวและคอลัมน์หรืออย่างอื่น?
SpitFire

1
ฉันไม่ได้ติดตามสิ่งที่คุณพูด คุณพยายามทำอะไรกับอาเรย์ของคุณ? (ดูการแก้ไขล่าสุดของฉันด้วย)
Jared Farrish

ในอาเรย์ฉันจะใส่จำนวนแถวและคอลัมน์ที่มีชื่อไม่ซ้ำกันหรือ ID .. และอีกแถวและคอลัมน์ที่มีชื่อหรือ ID ที่ไม่ซ้ำกันซึ่งอาเรย์แรกของแถวและคอลัมน์อินพุตจะถูกลบออกไปเป็นอินพุทที่ 2 ของ R และ C ..
SpitFire

28

อ้างจากโครงสร้างข้อมูลและอัลกอริทึมด้วย JavaScript

ส่วนที่ดี (O'Reilly, หน้า 64) Crockford ขยายวัตถุอาร์เรย์ JavaScript ด้วยฟังก์ชันที่กำหนดจำนวนแถวและคอลัมน์และตั้งค่าแต่ละค่าให้เป็นค่าที่ส่งผ่านไปยังฟังก์ชัน นี่คือคำจำกัดความของเขา:

Array.matrix = function(numrows, numcols, initial) {
    var arr = [];
    for (var i = 0; i < numrows; ++i) {
        var columns = [];
        for (var j = 0; j < numcols; ++j) {
            columns[j] = initial;
        }
        arr[i] = columns;
    }
    return arr;
}

นี่คือรหัสเพื่อทดสอบความหมาย:

var nums = Array.matrix(5,5,0);
print(nums[1][1]); // displays 0
var names = Array.matrix(3,3,"");
names[1][2] = "Joe";
print(names[1][2]); // display "Joe"

นอกจากนี้เรายังสามารถสร้างอาร์เรย์สองมิติและเริ่มต้นเป็นชุดของค่าในหนึ่งบรรทัด:

var grades = [[89, 77, 78],[76, 82, 81],[91, 94, 89]];
print(grades[2][2]); // displays 89

15

ประกาศโดยไม่มีการกำหนดค่า

2 มิติ ...

var arrayName = new Array(new Array());

3 มิติ ...

var arrayName = new Array(new Array(new Array()));

8
ตัวอย่างทั้งสองนี้ดูเหมือนจะสร้างอาร์เรย์ 1x1 & 1x1x1 เท่านั้น (ตามลำดับ) อาจเรียกว่าอาร์เรย์ซ้อนมิติเดียวอย่างถูกต้อง ในฐานะที่เป็นตัวอย่างvar test=new Array(new Array());test[0][0]='1';test[0][1]='2';test[1][0]='3';ข้อผิดพลาดกับข้อความException: test[1] is undefined
66001

2
ดูเหมือนว่าผิด เมื่อฉันลองใช้รหัสฉันจะได้รับอาร์เรย์ 1x1x0 jsfiddle.net/zU8SB/1มีการโหวตขึ้น 13 ครั้งอย่างไร?
Randall Cook

1
แทรกด้วย'Array.push'
bagz_man

12

ฉันรู้ว่านี่เป็นของโบราณ แต่เกี่ยวกับ ...

ตัวอย่าง 4x4 (actually 4x<anything>):

var matrix = [ [],[],[],[] ]

ซึ่งสามารถกรอกโดย:

for (var i=0; i<4; i++) {
   for (var j=0; j<4; j++) {
      matrix[i][j] = i*j;
   }
}

บางทีอาจทำให้เห็นได้ชัดว่าไม่มีอะไร "ภายนอก" 1x4 (ไม่ใช่เมทริกซ์ [3] [3] การเป็นแถวที่ 4, คอลัมน์ที่ 4) ถูกประกาศ (เช่นสามารถเข้าถึงได้) ด้วยการประกาศ var นี้ นอกจากนี้องค์ประกอบการตั้งค่าตัวอย่าง [0] [1] ถึง 5 จะข้ามองค์ประกอบแรก การใช้ [0] [0] แทนอาจมีประโยชน์ในการสาธิตให้เห็นถึงจุดสำคัญของอาร์เรย์ในภาษาการเขียนโปรแกรมจำนวนมาก
user66001

9

ง่ายมาก

var states = [,];
states[0,0] = tName; 
states[0,1] = '1';
states[1,0] = tName; 
states[2,1] = '1';

. . .

states[n,0] = tName; 
states[n,1] = '1';

ดูเหมือนจะไม่ทำงานเมื่อฉันทดสอบในคอนโซล ดูเหมือนว่าค่าเก่าจะถูกลบเมื่อฉันเขียนเพื่อบอกว่า [0,1] และ [1,1] ครั้งที่สองจะลบ [0,1] ...
โธมัส Dignan

8
function Array2D(x, y)
{
    var array2D = new Array(x);

    for(var i = 0; i < array2D.length; i++)
    {
        array2D[i] = new Array(y);
    }

    return array2D;
}

var myNewArray = Array2D(4, 9);

myNewArray[3][5] = "booger";

7

หวังว่ารหัสต่อไปนี้เหมาะสมกับความต้องการของคุณ

var row= 20;
var column= 10;
var f = new Array();

for (i=0;i<row;i++) {
 f[i]=new Array();
 for (j=0;j<column;j++) {
  f[i][j]=0;
 }
}

ใช่!! เคยดิ้นรนกับสิ่งนี้ตลอดไป! ความลับคือการสร้างอาร์เรย์พิเศษที่คอลัมน์แถว (หรือถ้าวนซ้ำในตารางความสูง)
NiCk Newman

4
var size = 0;   
 var darray = new Array();
    function createTable(){
        darray[size] = new Array();
        darray[size][0] = $("#chqdate").val();
        darray[size][1]= $("#chqNo").val();
        darray[size][2] = $("#chqNarration").val() ;
        darray[size][3]= $("#chqAmount").val();
        darray[size][4]= $("#chqMode").val();
    }

เพิ่มขนาด var หลังจากฟังก์ชั่นของคุณ


3

นี่คือทางออกของฉัน

ตัวอย่างง่ายๆสำหรับ 3x3 Array คุณสามารถผูกมัดสิ่งนี้ไว้เพื่อให้ลึกซึ้งยิ่งขึ้น

Array(3).fill().map(a => Array(3))

หรือฟังก์ชั่นต่อไปนี้จะสร้างระดับลึก ๆ ที่คุณต้องการ

f = arr => {
    let str = 'return ', l = arr.length;
    arr.forEach((v, i) => {
        str += i < l-1 ? `Array(${v}).fill().map(a => ` : `Array(${v}` + ')'.repeat(l);
    });
    return Function(str)();
}
f([4,5,6]) // Generates a 4x5x6 Array

http://www.binaryoverdose.com/2017/02/07/Generating-Multidimensional-Arrays-in-JavaScript/


2

คุณสามารถสร้างอาร์เรย์ตามรหัสด้านล่าง:

var arraymultidimensional = []
    arraymultidimensional = [[value1,value2],[value3,value4],[value5,value6]];

ผลลัพธ์:
[v1] [v2] ตำแหน่ง 0
[v3] [v4] ตำแหน่ง 1
[v5] [v6] ตำแหน่ง 2

สำหรับการเพิ่มไปยังอาร์เรย์แบบไดนามิกให้ใช้วิธีการด้านล่าง:

//vectorvalue format = "[value,value,...]"
function addToArray(vectorvalue){
  arraymultidimensional[arraymultidimensional.length] = vectorvalue;
}

หวังว่านี่จะช่วยได้ :)


1

ฉันได้สร้างโมดูล npmเพื่อทำสิ่งนี้โดยเพิ่มความยืดหยุ่น:

// create a 3x3 array
var twodimensional = new MultiDimensional([3, 3])

// create a 3x3x4 array
var threedimensional = new MultiDimensional([3, 3, 4])

// create a 4x3x4x2 array
var fourdimensional = new MultiDimensional([4, 3, 4, 2])

// etc...

นอกจากนี้คุณยังสามารถเริ่มต้นตำแหน่งด้วยค่าใด ๆ :

// create a 3x4 array with all positions set to 0
var twodimensional = new MultiDimensional([3, 4], 0)

// create a 3x3x4 array with all positions set to 'Default String'
var threedimensionalAsStrings = new MultiDimensional([3, 3, 4], 'Default String')

หรือสูงกว่า:

// create a 3x3x4 array with all positions set to a unique self-aware objects.
var threedimensional = new MultiDimensional([3, 3, 4], function(position, multidimensional) {
    return {
        mydescription: 'I am a cell at position ' + position.join(),
        myposition: position,
        myparent: multidimensional
    }
})

รับและกำหนดค่าที่ตำแหน่ง:

// get value
threedimensional.position([2, 2, 2])

// set value
threedimensional.position([2, 2, 2], 'New Value')

0

ฉันเขียนเส้นตรงหนึ่งสำหรับสิ่งนี้:

[1, 3, 1, 4, 1].reduceRight((x, y) => new Array(y).fill().map(() => JSON.parse(JSON.stringify(x))), 0);

ฉันรู้สึกว่าฉันสามารถใช้เวลามากขึ้นในการสร้างJSON.parse(JSON.stringify())เวอร์ชันฟรีที่ใช้สำหรับการโคลนที่นี่

Btw ได้ดูคำตอบของฉันที่นี่อีก


0

ฉันรู้ว่านี่เป็นคำถามเก่า แต่นี่คือสิ่งที่ต้องลอง: สร้างอาร์เรย์หลายมิติของคุณและวางไว้ในแท็ก html วิธีนี้คุณสามารถเล็งไปยังชุดข้อมูลอาร์เรย์ของคุณได้อย่างแม่นยำ:

//Your Holding tag for your inputs!
<div id='input-container' class='funky'></div>

<script>
    //With VAR: you can seperate each variable with a comma instead of:
    //creating var at the beginning and a semicolon at the end.
    //Creates a cleaner layout of your variables
    var
        arr=[['input1-1','input1-2'],['input2-1','input2-2']],
        //globall calls these letters var so you dont have to recreate variable below
        i,j
    ;

    //Instead of the general 'i<array.length' you can go even further
    //by creating array[i] in place of 'i<array.length'
    for(i=0;arr[i];i++){
    for(j=0;arr[i][j];j++){
        document.getElementById('input-container').innerHTML+=
            "<input class='inner-funky'>"+arr[i][j]+"</input>"
        ;
    }}
</script>

เป็นวิธีที่ง่ายที่สุดในการเขียนโค้ดและเรียกใช้งานได้ง่ายขึ้น คุณสามารถตรวจสอบตัวอย่างของฉันที่นี่!


คุณสามารถโดดเด่นยิ่งขึ้นด้วยการทำให้document.querySelectorAll();ได้รับคลาสรหัสและองค์ประกอบ!
Gareth Compton
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.