자바스크립트 Array 객체 함수 (1)

Javascript 문법중에서 사용빈도가 가장 높은 축에 드는 객체입니다. 

굉장히 유연해서 사용하기가 편리하다는게 크게 작용하지 않을까 합니다.

Javascript Array에는 많은 메소드들이 있는데 하나씩 알아보려고 합니다.

var aCarMakers = ["Benz", "BMW", "Audi"];
console.log(aCarMakers);
 
// 맨 끝에 item 추가
aCarMakers.push("Honda");
console.log(aCarMakers);
 
// 해당 텍스트를 기준으로 String 변화
console.log(aCarMakers.join(" # "));
 
// 맨 끝에 item 삭제
aCarMakers.pop();
console.log(aCarMakers);
 
// 맨 앞에 item 삭제
aCarMakers.shift();
console.log(aCarMakers);
 
// 맨 앞에 item 추가
aCarMakers.unshift("Toyoda");
console.log(aCarMakers);
 
// index 찾기
console.log("BMW index : " + aCarMakers.indexOf("BMW"));
aCarMakers.push("Samsung");

결과값

Array에 데이터를 앞뒤로 추가하고 삭제하는게 매우 쉽습니다. 메소드만 호출하면 되기 때문입니다.

중간에 데이터를 넣거나 삭제할수도 있습니다.

aCarMakers.push("Samsung");
 
// splice는 원본 배열 객체가 변경
// 해당 index의 데이터 삭제
// 첫번째 인자는 시작위치, 두번째 인자는 삭제할 데이터 갯수
var aAfterSpliceCarMaers = aCarMakers.splice(1, 2);
console.log("aCarMakers");
console.log(aCarMakers);
console.log("aAfterSpliceCarMaers");
console.log(aAfterSpliceCarMaers);
 
// 해당 index의 데이터 삽입
// 삭제할 데이터 갯수를 0으로 해주고 넣어줄 데이터를 뒤에 붙여주면 시작위치부터 데티어 삽입
aCarMakers.splice(1, 0, "Lamborghini", "Porsche", "Bugatti");
console.log(aCarMakers);
 
// slice는 원본 배열 객체 변경 안됨
// 메소드 실행 후 return 값을 이용
// 첫번째 인자는 시작위치, 두번째 인자는 종료 위치(두번째 인자가 없으면 끝까지)
var aAfterSliceCarMaers1 = aCarMakers.slice(2);
console.log(aAfterSliceCarMaers1);
var aAfterSliceCarMaers2 = aCarMakers.slice(2,3);
console.log(aAfterSliceCarMaers2);
var aAfterSliceCarMaers3 = aCarMakers.slice(1,3);
console.log(aAfterSliceCarMaers3);
console.log("aCarMakers");
console.log(aCarMakers);
 

결과

splice는 원본 객체의 데이터가 변화가 없고 slice는 원본 객체 자체의 데이터를 변경하는 것만 헷갈리지 않으면 될 거 같습니다.

splice는 원복 객체를 건드리지 않기 때문에 return 값을 받아서 사용하면 됩니다.

다른 메소들이 많지만 중요한 내용이라 이번 내용은 여기까지하겠습니다. 다음 포스팅에 다시...