[JavaScript] Array, Object

배열 (Array)

// 배열은 순서가 있는 값. 안의 요소를 element 라고 함.
// [] : 대괄호 (square bracket)
let myArray = [3, 6, 1, 4, 2];
myArray[2] = 3; // 배열의 요소 변경
myArray[0]; // 배열 요소 조회

// 2차원 배열 (2 dimensional array)
let my2DArray = [[1, 2], [3, 4], [5, 6]];
my2DArray[2][0]; // 5

Array methods

let myArray = [1, 2, 3, 4, 5];

// 속성(property) vs 메소드(method, function)
myArray.length // property 접근 (JS 배열에서 속성은 length 하나뿐이다.)
myArray.push(4) // method 호출

myArray.length; // 배열의 길이 (칸수), 5

myArray.push(6); // 끝에 값 추가
myArray.pop(); // 끝의 값 삭제
myArray.shift();// 배열 앞에 값 삭제
myArray.unshift(0); // 배열 앞에 값 추가

myArray.indexOf(3); // index 확인, 2. 없는 경우 -1.
myArray.includes(3); // 존재 유무 확인, true.
// .indexOf()가 있기 때문에 굳이 .includes()를 쓸 필요가 없어 보인다.

myArray.join(); // 배열의 요소들을 합쳐 문자열을 반환. 인자가 없을 시 ', '를 삽입.
// '1, 2, 3, 4, 5'
myArray.join(''); // '12345'
'I love you'.split(' '); // 문자열을 인자에 따라 나누어 배열로 변환, ['I', 'love', 'you']

Array.isArray(myArray); // 배열 판정, true.
console.table(myArray); // 배열을 테이블로 출력

객체 (Object)

// 중괄호(curly brackets) 사용, key-value pair
let user = {
	firstName : 'Steve',
    lastName : 'Jung',
    email: 'jhoryong@gmail.com',
    city: 'Seoul'
};

// dot notation
user.firstName; // 'Steve'
// 변수를 담지 못한다.

// bracket notation
user['firstName']; // 'Steve'
// key가 변수일 때 사용하면 유용하다.

// 자주 하는 실수들
user[firstName] // ReferenceError: firstName is not defined
// firstName 을 key 가 아니라 변수로 취급. [] 안에 문자열을 넣어야 한다.

// key-value pair 추가/삭제
user.age = 28;// key-value pair 추가
delete user.firstName;// key-value pair를 삭제
'city' in user; // 객체안의 key값의 유무를 확인, true

// for in
for (let key in user) {
  console.log(key + ':' + user[key])
}
// user 내의 모든 key-value pair 를 출력한다.

for in, for of

• for in: 객체의 property를 iterate 할 때 쓴다. [enumerable] 속성이 true 면 for-in 을 쓸 수 있다. (Object는 enumerable 이 true다.)
• for of: 배열, 문자열 등을 iterate 할 때 쓴다.
  • [Symbol.iterator] 속성이 있는 객체는 for of 가 사용이 가능하다.

let a = [1,2,3]
let b = 'abc'
for (let element of a) console.log(element); // 1 2 3
for (let element of b) console.log(element); // a b c 

느낀점

• C++ 의 경우 vector 에서 push_front, pop_front 함수는 아예 없다. 왜냐하면 O(n)이기 때문이다. 근데 자바스크립트는 .shift(), .unshift() 가 존재한다... 심지어 MDN 에서도 해당 함수들의 비효율성에 대해 말하지 않는다. 자바스크립트는 효율보다는 생산성에 더 초점을 맞추고 있어서 그런걸까?
• 나무위키에서 js 는 애증의 언어라고 말하고 있는데 왜 프로그래머들이 그렇게 느끼는지 조금 이해가 된다.