알고리듬 #6 | JS의 배열과 객체

배열과 객체

배열

• 출선번호와 같이 값을 번호로 추적할 수 있습니다.

객체

• 이름이 붙어있는 사물함을 추적하는 것과 같습니다.

---

자바스크립트의 배열

배열 생성방법

const arr1 = new Array();			// []
const arr2 = [];					// []
const arr3 = [1, 2, 3, 4, 5];		// [1, 2, 3, 4, 5]
const arr4 = new Array(5);			// [ <5 empty items> ]
const arr5 = new Array(5).fill(5);	// [5, 5, 5, 5, 5]
const arr6 = Array.from(Array(5), (v, i) => i + 1)
// [1, 2, 3, 4, 5]

*from 메서드 : 첫 인자로 배열, 두번째 인자로 함수를 받아 첫 번째 인자를 베이스로 함수를 통해 출력된 값으로 배열 생성, Immutable

---

배열의 속성

• Array.length : 배열의 길이 반환, Array.length = 10 과 같이 길이를 직접 지정해줄 수 잇지만 사용 지양

---

배열의 메서드

편의성 함수

• Array.prototype.join() : 배열의 모든 요소를 연결해 문자열로 만듭니다. Immutable
• Array.prototype.reverse() : 요소들의 손서를 뒤집어줍니다. Mutable
• Array.prototype.concat() : 두 배열을 합칩니다. Immutable

요소 추가, 삭제

• Array.prototype.push(), Array.prototype.pop() : 배열의 끝부분에 요소 추가, 삭제 Mutable
• Array.prototype.unshift(), Array.prototype.shift : 배열의 첫부분에 요소 추가, 삭제 Mutable

배열 복제

• Array.prototype.slice() : 지정한 시작점부터 끝점 이전까지 배열 복제하여 반환 Immutable

---

배열의 순회

반복문

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

for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

for of

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

for (const item of arr) {
  console.log(item);
}

---

배열의 타입은 객체

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

arr["key"] = "value";

console.log(arr);
// [1, 2, 3, 4, 5, 6, key: "value"]
console.log(arr.length);
// 6

배열을 객체와 같이 사용하는 것이 올바른 방법은 아닙니다. 사용 X

---

자바스크립트의 객체

객체 생성방법

const obj1 = new Object();	// {}
const obj2 = {};			// {}
const obj3 = { name: "박연우", company: 
"CodeStates"};
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 * }
 */

객체요소 추가, 삭제

• 괄호 표기법 (bracket notation)

const obj = { name: "박연우", company: 
"CodeStates"};
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 * }
 */

obj["email"] = "yeonwoopark22@gmail.com";
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 *   email: 'yeonwoopark22@gmail.com',
 * }
 */

delete obj["email"];	// true
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 * }
 */

• 점 표기법 (dot notation)

const obj = { name: "박연우", company: 
"CodeStates"};
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 * }
 */

obj.email = "yeonwoopark22@gmail.com";
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 *   email: 'yeonwoopark22@gmail.com',
 * }
 */

delete obj.email;	// true
/* {
 *   name: '박연우',
 *   company: 'CodeStates',
 * }
 */

키 존재여부 확인

const obj = { name: "박연우", company: "CodeStates" };

console.log("name" in obj);		// true
console.log("phone" in obj);	// false

객체 메서드

• Object.keys() : 해당 객체의 키들로 배열 생성, 반환
• Object.values() : 해당 객체의 값들로 배열 생성, 반환

객체의 순회

• for in

const obj = { name: "박연우", company: "CodeStates" };

for (const key in obj) {
  console.log(key, obj[key]);
}
//	'name' '박연우'
//	'company' 'CodeStates'

---