배열에 객체를 추가하는 방법


317

javascript 또는 jquery에서 배열에 객체를 어떻게 추가 할 수 있습니까? 예를 들어,이 코드의 문제점은 무엇입니까?

function(){
    var a = new array();
    var b = new object();
    a[0]=b;
}

이 코드를 사용하여 function1의 배열에 많은 객체를 저장하고 array2의 객체를 사용하기 위해 function2를 호출하고 싶습니다.

  1. 배열에 객체를 어떻게 저장할 수 있습니까?
  2. 객체를 배열에 넣고 변수에 저장하려면 어떻게해야합니까?

12
편집 5에서와 같이 게시 된 코드의 오류를 수정하지 마십시오. 질문에서 간단한 오류를 수정하면 대답이 존재할 이유가없는 경우가 종종 있습니다.
Paul

또한 push이미 여러 번 제안되었습니다. 다른 push제안 으로이 스레드를 더 이상 오염시키지 마십시오 .
Boghyon Hoffmann

답변:


631

Array.push ()를 사용하여 배열에 무엇이든 넣습니다.

var a=[], b={};
a.push(b);    
// a[0] === b;

배열에 대한 추가 정보

한 번에 둘 이상의 항목 추가

var x = ['a'];
x.push('b', 'c');
// x = ['a', 'b', 'c']

배열의 시작 부분에 항목 추가

var x = ['c', 'd'];
x.unshift('a', 'b');
// x = ['a', 'b', 'c', 'd']

한 배열의 내용을 다른 배열에 추가

var x = ['a', 'b', 'c'];
var y = ['d', 'e', 'f'];
x.push.apply(x, y);
// x = ['a', 'b', 'c', 'd', 'e', 'f']
// y = ['d', 'e', 'f']  (remains unchanged)

두 배열의 내용으로 새 배열을 만듭니다.

var x = ['a', 'b', 'c'];
var y = ['d', 'e', 'f'];
var z = x.concat(y);
// x = ['a', 'b', 'c']  (remains unchanged)
// y = ['d', 'e', 'f']  (remains unchanged)
// z = ['a', 'b', 'c', 'd', 'e', 'f']

나도 질문이있다 : myArray = []; myArray.push ({ 'text': '일부 텍스트', 'id': 13}); 이제 myArray가 비어 있습니다. 그래서 우리가 myArray [0] [ 'text']에서 값을 얻으려고하면 비어있을 것입니다. 왜 그렇습니까? take.ms/jSvbn
fdrv

뭔가 옳지 않은 것 같습니다. 범위 지정 문제가 없는지 확인하십시오. let / var을 사용하여 myArray를 선언하십시오. myArray.push는 항상 myArray를 변경하기 때문입니다.
John Strickler

58
var years = [];
for (i= 2015;i<=2030;i=i+1)
{
years.push({operator : i})
}

여기서 배열 연도는 다음과 같은 값을 갖습니다.

years[0]={operator:2015}
years[1]={operator:2016}

이렇게 계속됩니다.


55

우선, 어떤이없는 objectarray. 있다 ObjectArray. 둘째, 당신 수 있습니다 :

a = new Array();
b = new Object();
a[0] = b;

이제 유일한 요소로 a배열이 b됩니다.


4
가장 복잡하지 않은 답변은 +1입니다. OP의 질문 2에 대한 답변을 포함하도록 아래를 확장했습니다.
Sam

30

ES6표기법을 사용하면 다음과 같이 할 수 있습니다.

추가하려면 다음 과 같이 스프레드 연산자를 사용할 수 있습니다 .

var arr1 = [1,2,3]
var obj = 4
var newData = [...arr1, obj] // [1,2,3,4]
console.log(newData);


20
  • JavaScript는 대소 문자를 구분 합니다. 존재하지 않기 때문에 전화하고을 new array()( new object()를) 던질 것 ReferenceError입니다.
  • 오류가 발생하기 쉬운 행동new Array() 으로 인해 피하는 것이 좋습니다 . 대신을 사용하여 새 배열을 할당하십시오 . 개체의 경우
    = [val1, val2, val_n]= {} .
  • John의 답변에 표시된 것처럼 배열을 확장하는 방법에는 여러 가지가 있지만 가장 안전한 방법은 concat대신에 사용하는 것입니다 push. concat원래 배열은 그대로두고 새 배열을 반환합니다. 특히 배열이 전역 적으로 정의 된 경우 피해야push 하는 호출 배열을 변경합니다 .
  • 의도하지 않은 돌연변이를 피하기 위해 새로운 배열뿐만 아니라 객체 를 고정 시키는 것도 좋습니다 . 고정 된 개체는 변경하거나 확장 할 수 없습니다 (얕게).

이러한 점을 적용하고 두 가지 질문에 대답하기 위해 다음과 같은 기능을 정의 할 수 있습니다.

function appendObjTo(thatArray, newObj) {
  const frozenObj = Object.freeze(newObj);
  return Object.freeze(thatArray.concat(frozenObj));
}

용법:

// Given
const myArray = ["A", "B"];
// "save it to a variable"
const newArray = appendObjTo(myArray, {hello: "world!"});
// returns: ["A", "B", {hello: "world!"}]. myArray did not change.

2
"사용"은 이것을 개인적으로 선호하는 답변으로 만들었습니다.
HPWD

@ boghyon, 나는 동결과 돌연변이에 대해 궁금합니다. concat 메소드 또는 '.concat ()'을 수행하는 과정에서 스크립트의 다른 곳에서 배열에 대한 변경으로 인해 발생할 수있는 배열 변경에 대해 이야기하고 있습니까? 두 번째로, 비동기 코드의 경우에도 자바 스크립트가 단일 스레드로 인해 자동으로 방지되어서는 안됩니다. 비록 이론적으로는 메서드가 완료 될 때까지 제어가 반환되지 않아야하기 때문에?
jdmayfield

@jdmayfield : JS의 평가 전략은 object-sharing에 의한 호출 입니다. 개체가 전달되면 복사되지 않습니다. 이러한 객체의 돌연변이는 전달되는 동안 뮤 테이터가 비동기 적으로 호출되었는지, 완료되었는지에 관계없이 항상 호출자에게 즉시 표시됩니다. 이러한 부작용으로 인해 버그가 발생 했으므로 원래 개체와 분리 된 새 개체를 반환합니다. 객체를 불변으로 만드는 것은 freeze의도하지 않은 돌연변이를 막기위한 추가 단계 일뿐입니다.
Boghyon Hoffmann

@jdmayfield : 그러나 이미 짐작했듯이, 객체가 커지면 매번 새 객체를 만드는 것이 비효율적 일 수 있습니다. 이러한 경우 유용한 라이브러리가 있으며 Mori (kinda dead) 및 Immutable.js 와 같은 지속적인 데이터 구조를 활용하여 효율적으로 만듭니다 . 다음은 "불변성 이유"에 대한 간략한 소개입니다. youtu.be/e-5obm1G_FY
Boghyon Hoffmann

9

Gabi Purcaru의 답변을 확장하여 2 번 답변을 포함합니다.

a = new Array();
b = new Object();
a[0] = b;

var c = a[0]; // c is now the object we inserted into a...

8

/* array literal */
var aData = [];

/* object constructur */
function Data(firstname, lastname) {
  this.firstname = firstname;
  this.lastname = lastname;
  this.fullname = function() {
    return (this.firstname + " " + this.lastname);
  };
}

/* store object into array */
aData[aData.length] = new Data("Java", "Script"); // aData[0]

aData.push(new Data("Jhon", "Doe"));
aData.push(new Data("Anna", "Smith"));
aData.push(new Data("Black", "Pearl"));

aData[aData.length] = new Data("stack", "overflow"); // aData[4]

/* loop arrray */
for (var x in aData) {
  alert(aData[x].fullname());
}

/* convert array of object into string json */
var jsonString = JSON.stringify(aData);
document.write(jsonString);


7

obejct분명히 오타입니다. 그러나 모두 objectarray 필요 대문자.

당신은 짧은 손을 사용할 수 있습니다 new Arraynew Object다음은[]{}

을 사용하여 데이터를 배열로 푸시 할 수 있습니다 .push. 배열 끝에 추가합니다. 또는 데이터를 포함하도록 인덱스를 설정할 수 있습니다.

function saveToArray() {
    var o = {};
    o.foo = 42;
    var arr = [];
    arr.push(o);
    return arr;
}

function other() {
    var arr = saveToArray();
    alert(arr[0]);
}

other();

5

대안 적 대답은 이것입니다.

다음과 같이 배열하면 : var contacts = [bob, mary];

이 배열에 다른 배열을 넣으려면 다음과 같이하십시오.

함수 생성자 선언

function add (firstName,lastName,email,phoneNumber) {
this.firstName = firstName;
this.lastName = lastName;
this.email = email;
this.phoneNumber = phoneNumber;
}

함수에서 객체를 만듭니다.

var add1 = new add("Alba","Fas","Des@gmail.com","[098] 654365364");

객체를 배열에 추가하십시오.

contacts[contacts.length] = add1;

3
a=[];
a.push(['b','c','d','e','f']);

6
안녕하세요, SO에 오신 것을 환영합니다. 답변으로 코드를 덤프하지 마십시오. 사용자가 진행 상황을 더 잘 이해할 수 있도록 생각을 설명하십시오. 감사.
크 툴후

2

자동 목록을 사용하여 객체 생성자를 만드는 방법 :

var list = [];

function saveToArray(x) {
    list.push(x);
};

function newObject () {
    saveToArray(this);
};

0

코드를 그대로 사용하면 범위 문제가 발생합니다. 그것들 사이에 사용할 계획이라면 (또는 호출하는 경우 매개 변수로 전달) 함수 외부에서 선언해야합니다.

var a = new Array();
var b = new Object();

function first() {
a.push(b);
// Alternatively, a[a.length] = b
// both methods work fine
}

function second() {
var c = a[0];
}

// code
first();
// more code
second();
// even more code
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.