array 생성자 함수와 같이 함수 생성의 기능을 하지만 생성자 함수의 경우 인자를 숫자 한 개 만 넣을 경우 그 숫자가 length 값이 되지만 Array.of 메소드는 요소로 기능한다.
ex)
//생성자 함수
var arr = new Array(4)
console.log(arr)
[비어 있음 × 4]
// Array.of
var arr = Array.of(3)
console.log(arr)
[3]
Array.prototype.concat VS Array.prototype.push (배열추가)
concat과 push는 인자를 배열의 마지막에 추가한다는 기능이 같지만 concat 원본의 배열을 변경하지 않지만 push는 원본의 배열을 변경한다.
ex)
//concat
const arr1 = [1, 2];
const arr2 = [3, 4];
let result = arr1.concat(arr2);
console.log(result); // [1, 2, 3, 4]
// 숫자를 원본 배열 arr1의 마지막 요소로 추가한 새로운 배열을 반환
result = arr1.concat(3);
console.log(result); // ["1, 2, 3]
// 원본 배열은 변경되지 않는다.
console.log(arr1); // [1, 2]
----------------------------------------------------------------------------------------
//push
const arr = [1, 2];
// 인수로 전달받은 모든 값을 원본 배열의 마지막에 요소로 추가하고 변경된 length 값을 반환한다.
let result = arr.push(3, 4);
console.log(result); // 4
// push 메소드는 원본 배열을 직접 변경한다.
console.log(arr); // [1, 2, 3, 4]
pop VS shift(배열제거)
pop는 맨 마지막 배열을 제거하며 제거한 배열의 값을 반환한다. shift는 맨 처음의 배열을 제거하며 제거한 배월의 값을 반환한다.
두 메소드 모두 원본배열을 변경한다.
얕은 복사 VS 깊은 복사
얕은 복사는 복사본의 값을 변경하였을 때 원본의 값도 같이 변경된다. 즉, 같은 데이터를 참조하고 있다는 뜻이다.
const todos = [
{ id: 1, content: 'HTML', completed: false },
{ id: 2, content: 'CSS', completed: true },
{ id: 3, content: 'Javascript', completed: false }
];
// shallow copy
const _todos = todos.slice();
// const _todos = [...todos];
console.log(_todos === todos); // false
// 배열의 요소는 같다. 즉, 얕은 복사되었다.
console.log(_todos[0] === todos[0]); // true