객체와 클래스

객체를 생성하는 방법

var user = new Object();
user.name = 'Sunny';
user.interests= ['Traveling', 'Swimming'];
user.greeting = function () {
	console.log('Hi');
};
user.greeting();

var user = {
	name: 'Sunny',
	interests : ['Traveling', 'Swimming'],
	greeting: function() {
		console.log('Hi');
	}
}

function User(name, interests) {
	this.name = name;
	this.interests = interests;
	this.greeting = function () {
		console.log('Hi');
	}
}

var user = new User('Sunny', ['Traveling', 'Swimming']);

var user = Object.create(User.prototype, {
		name : { value : 'Sunny' },
		interests: { value : ['Traveling', 'Swimming'] }
});

function createUser(name, interests) {
	var user = {};
	user.name = name;
	user.interests = interests;
	user.greeting = function () {
		console.log('Hi');
	};
	return user;
}
var user = createUser('Sunny', ['Traveling', 'Swimming']);

class User {
	// User 생성자 함수와 상응
	constructor(name, interests) {
		this.name = name;
		this.interests = interests;
	}
	// User.prototype.greeting과 같다
	greeting() {
		console.log('Hi');
	}
}
let user = new User('Sunny', ['Traveling', 'Swimming']);

in 연산자, delete 연산자

var jane = {
	name : 'Jane',
	describe : function () {
			return 'Person named ' + this.name;
	}
};

jane.newProperty = 'abc';

'newProperty' in jane // true
'foo' in jane // false

delete jane.newProperty // true
'newProperty' in jane // false

임의의 프로퍼티 키

• 프로퍼티 키에는 어떤 문자열이든 사용하여 정의, 접근이 가능한데 이는 키가 유효한 식별자일 때만 가능함

• 식별자로 유효하지 않은 문자열을 키로 사용할 때 객체 리터럴에서는 따옴표로, 프로퍼티에 접근할 때는 대괄호로 감쌉니다

var obj = { 'not an identifier' : 123 };
obj['not an identifier'] // 123

obj['not an identifier'] = 456;

var obj = { hello : 'world' };

var x= 'hello';
obj[x] // 'world'

obj['hel' + 'lo'] // 'world'

추출 메서드

'use strict'
var jane = {
	name : 'Jane',
	describe : function () {
				return 'Person named ' + this.name;
	}
};

var func = jane.describe;
func(); // TypeError: Cannot read property 'name' of undefined

• 메서드를 객체에서 추출하면 객체와의 연결이 사라져서 추출된 메서드는 함수일 뿐 메서드가 아니게 됨 (this 가 undefined가 됨 — 스트릭트 모드에서)

var func2 = jane.describe.bind(jane);
func2() // Person named Jane

• 해결책은 모든 함수에 존재하는 bind( ) 메서드를 사용하는 것. 생성된 함수의 this는 항상 넘겨받은 값임

메서드 내부의 함수

var jane = {
		name : 'Jane',
		friends : [ 'Tarzan', 'Cheeta' ],
		logHiToFriends: function () {
				'use strict'
				this.frineds.forEach(function (friend) {
						// 여기서는 'this'가 undefined
						console.log(this.name + ' says hi to ' + friend);
				});
		}
}

jane.logHiToFriends() // TypeError : Cannot read property 'name' of undefined

• 메서드 내부에서 함수를 사용할 경우, 해당 함수에서 메서드의 this에 접근할 수 없음

• 자바스크립트에서는 함수 표현식을 함수의 parameter로 호출하는 경우가 많은데, 함수 표현식 내부에서 this를 사용하는 경우는 항상 신중해야 함!

해결책

• this를 다른 변수에 저장하는 방법

logHiToFriends : function () {
		'use strict'
		var that = this;
		this.friends.forEach(function (friend) {
				console.log(that.name + ' says hi to ' + friend);
		});
}

• forEach가 받는 두 번째 매개변수를 이용하는 방법

logHiToFriends : function () {
		'use strict'
		this.friends.forEach(function (friend) {
				console.log(this.name + ' says hi to ' + friend);
		}, this);
}