JavaScript] 자바스크립트 뿌시기 (배열)

🎉 배열

---

배열

• 크기를 지정하지 않아도 된다.
• 어떤 위치에 어느 타입의 데이터를 저장해도 된다.

배열 리터럴

• 대괄호를 사용 (객체 리터럴은 중괄호)

  var company = ['SAMSUNG', 'SK', 'LG', 'NAVER', 'HYUNDAI'];
  console.log(company[1]); // print >> SK

• 0 인덱스이다.

배열 요소 생성

• 아무 인덱스 위치에 값을 동적으로 추가 가능

• 모든 배열은 length 프로퍼티가 있다.

  company[10] = true;
  console.log(company); // print >> [ 'SAMSUNG', 'SK', 'LG', 'NAVER', 'HYUNDAI', <5 empty items>, true ]
  console.log(company.length); // print >> 11

배열의 length 프로퍼티

• 배열의 크기도 인덱스 중 가장 큰 값이 기준

  • 실제 메모리는 length 크기처럼 할당되지는 않는다.

• length 프로퍼티는 코드를 통해 명시적으로 값 변경 가능

  var arr = [0, 1, 2];
  console.log(arr.length); // print >> 3
  
  arr.length = 4;  
  console.log(arr); // print >> [ 0, 1, 2, <2 empty items> ]
  
  arr.length = 2;  
  console.log(arr); // print >> [ 0, 1 ]

• 빈 인덱스는 실제로 메모리가 할당되지는 않음

• 값이 존재하는 인덱스보다 길이를 줄이면 벗어나는 인덱스들은 실제로 삭제 됨

배열의 push() 메서드

• push()메서드는 length 프로퍼티의 인덱스에 값을 저장한다.
• length 값은 push()와 같은 표준 배열 메서드 동작에 영향을 줄 수 있다.

배열과 객체

var companyArr = ['SAMSUNG', 'SK', 'LG', 'NAVER', 'HYUNDAI'];
var companyObj = {
    '0' : 'SAMSUNG',
    '1' : 'SK',
    '2' : 'LG',
    '3' : 'NAVER',
    '4' : 'HYUNDAI'
}
console.log(companyArr[0]);
console.log(companyObj[0]); // companyObj['0']이란 문법이 맞지만, 자바스크립트 엔진이 []연산자 내에 숫자가 오면, 자동으로 문자열로 바꿔주어서 해당 코드도 맞다.

companyObj은 배열이 아니라 push()와 같은 표준 배열 메서드를 사용할 수 없다.
왜? 배열과 객체는 자신의 부모인 프로토타입 객체가 서로 다르기 때문이다.

• 객체의 프로토타입 : Object.prototype 객체

• 배열의 프로토타입 : Array.prototype 객체 (push(), pop() 등 포함)

  Array.prototype 객체의 프로토타입은 Object.prototype 객체

배열의 프로퍼티 동적 생성

• 배열도 자바스크립트 객체라 동적으로 프로퍼티 추가가 가능하다.

• 배열도 객체처럼 key:value 형태로 배열 원소, 프로퍼티 등이 있다.

  var company = ['SAMSUNG', 'SK', 'LG', 'NAVER', 'HYUNDAI'];
  
  company.wishList = 'LINE';  
  company.fintech = 'DANAL';
  
  console.dir(company);  
  /* print  
  [  
  'SAMSUNG',  
  'SK',  
  'LG',  
  'NAVER',  
  'HYUNDAI',  
  wishList: 'LINE',  
  fintech: 'DANAL'  
  ]  
  */
  

배열의 프로퍼티 열거

• for in 문 : 불필요한 프로퍼티가 출력 될 수 있다.
• for 문 : 정확히 배열의 요소만 출력한다.

배열 요소 삭제

• delete
  • delete arr[1]로 배열 요소를 삭제하면, 해당 자리에 undefined가 할당된다. length도 변하지 않는다.
• splice(start = 배열의 시작 위치, deleteCount = start포함하여 삭제할 요소 수, item = 삭제할 위치에 추가할 요소 ...)
  • splice(2,1); // 2번째 요소를 삭제한다.

Array() 생성자 함수

var desert = new Array(4);
var member = new Array('jun', 'ye', 'sun')

유사 배열 객체

To be continue.....

📖출처

---

송형주, 고현준 지음, 『인사이드 자바스크립트』, 한빛미디어(2014)