TIL 20210928

1#### 참조에 의한 객체 복사

객체와 원시형의 근본적 차이 - 참조에 의해by reference 저장/복사됨

let message = 'hello world!'
let phrase = message;

let user = { name: '9ing' }
let adimn = user ; // 참조값을 복사함

객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사됨.
객체는 복사되지 않음..

let user = { name: '9ing' }
let adimn = user ; // 참조값을 복사함

admin.name = 'Guheee'
alert(user.name);

참조에 의한 비교

동등연산자 ==
일치연산자 ===

let a = {};
let b = a; // 참조에 의한 복사

alert( a == b ) // true
alert( a === b ) // true

let a = {};
let b = {}:

alert( a == b ) // false

객체 복사, 병합과 Object.assign

새로운 빈 객체에 복사할 프로퍼티 전부를 복사해넣기..

let user = {
	name : '9ing',
    age : 80
};

let clone = {}; // 새로운 빈 객체
for ( let key in user ) {
	clone[key] = user[key];
}
clone.name = 'guheee' // 완전히 별개의 복제본...

alert(user.name); // 9ing

Object.assign(복제본이 될 대상, 복제하려고 하는 객체)
대상 객체에 동일한 프로퍼티가 있을경우 override됨.

중첩 객체 복사

let user = {
	name : '9ing',
    sizes: {
    	height : 170,
      	width : 3
    }
]

let clone = Object.assign({}, ueser);
alert(user.sizes === clone.sizes); // true, 동일 객체!

// user 와 clone 은 sizes 를 공유..
user.sizes.width++ // user에서 프로퍼티 변경
alert(clone.sizes.width); // 4

값이 객체인 경우 객체의 구조도 복사해주는 반복문을 사용
=> 깊은 복사deep cloning

Structured cloning algorithm
lodash의 메서드 _.cloneDeep(obj)

가비지 컬렉션garvage collection

도달 가능한reachable 값은.. 접근하거나 사용할 수 있는 값..
은 함부로 메모리에서 삭제되지 않음

참조하는값... 참조할 수 있는 값..

메서드와 this

let user = 
	name : '9ing',
    age : 80;
};

user.sayHi= function() {
	alert('hello~');
};

user.sayHi(); // hello~

함수 표현식으로 함수를 만들고, 객체 프로퍼티 user.sayHi 에 함수 할당
sayHi <- 얘가 메서드...(객체 프로퍼티에 할당된 함수)

객체를 사용하여 개체를 표현하는 방식
객체 지향 프로그래밍object-oriented programming

메서드 단축 구문

객체 리터럴 안에 메서드를 선언할때 쓰는 단축 문법

user - {
	sayHi : function() {
    	alert('hello');
    }
};

// 같은 메서드..?
user = {
	sayHi() {
    	alert('hello')
    }
};

메서드와 this

메서드는 대체로 객체에 저장된 정보에 접근할 수 있어야..
객체프로퍼티의 값을 활용..
메서드 내부에서 this 키워드 사용하면 객체에 접근할 수 있다

let user = {
	name : '9ing',
    age : 80,
    
    sayHi() {
    	// 'this'는 현재 객체를 나타냄..
    	alert(this.name);
    }
};

user.sayHi(); // 9ing

자유로운 this

자바스크립트의 this ... 컨텍스트에 따라..

this 가 없는 화살표 함수

화살표함수는 일반함수와 달리 '고유한'this를 가지지 않음.
화살표함수에서 this를 참조하면 외부에서 this값을 가져옴.

let user = {
	firstName : 'j',
    sayHi() {
    	let arrow = () => alert(this.firstName);
        arrow();
    }
};

user.sayHi(); // j