배열과 유사배열

var array = [1,2,3];
array; // [1,2,3]

var nodes = document.querySelectAll('li'); 
/* NodeList {0: HTMLLIElement, 1: HTMLLIElement, 2: HTMLLIElement, 3: HTMLLIElement, constructor: Object}
*      0: <li>apple</li>
*      1: <li>orange</li>
*      2: <li>banana</li>
*      3: <li>strawberry</li>
*      <constructor>: "NodeList"
*	      name: "NodeList"
*/

var els = document.body.children; 
/* HTMLCollection {0: HTMLDivElement, 1: HTMLScriptElement, constructor: Object}     
*      0: <div id="app">…</div>
*      1: <script src="src/index.js"></script>
*      <constructor>: "HTMLCollection"
*            name: "HTMLCollection"
*/

array는 배열, nodes와 els는 유사배열

 

메서드로 배열인지 알아내기

Array.isArray(array); // true
Array.isArray(nodes); // false
Array.isArray(els); // true

배열 리터럴로 선언한 array만 배열 array instance Array로도 판단 가능.

 

참조할당

한 객체의 값을 수정하면 다른 객체의 값 또한 동일하게 변화. 이걸 참조한다고 한다.

const original = {
	a: 1,
	b: 2
}

const copied = original;
original.a = 1000;
copied.b = 2000;

console.log(copied.a); // 1000
console.log(copied.b); // 2000
console.log(original.a); // 1000
console.log(original.b); // 2000

얕은복사 (Shallow Clone)

• Object.assign()

객체의 속성을 복사할 때 사용하는 Object.assign()

첫번째 인자로 들어오는 객체에 두번째 인자로 들어오는 객체의 프로퍼티들을 복사

const obj = {a: 1, b: 2};
const target = {c: 3};

const copiedObj = Object.assign(target, obj);
console.log(copiedObj);

Object.assign() 단점 :

복사하려는 객체의 내부에 존재하는 객체는 완전한 복사가 이루어지지 않음.

const person = {
	age: 30,
	name: {
		first: 'john',
		last: 'Smith'
	}
}

const copied = Object.assign({}, person);
person.age = 25;
person.name.first = "Tayler"

console.log(copied.age); // 30
console.log(copied.name.first); // Tayler