🔔하기전에

리터널과 생성자로 객체만드는 방법을 각각 해보자

🔔코드

리터널
리터널을 이용한 obj생성

// 객체 리터널(이니셜라이저)를 이용한 객체 생성
let obj = {name:'홍길동','age':20};// 프로퍼티이름:값, 프로퍼티명은 문자열만 가능

console.log(typeof obj);//object

// 객체 속성 값 확인
console.log(obj.name);//홍길동

// 객체 속성 값 변경
obj.name = '김자바';

let s;
s = obj.age >= 19 ? obj.name+'님은 성인입니다' : obj.name+' 미성년자입니다';
console.log(s);

obj.Age=22; //대소문자가 틀리면 기존 속성을 변경하지 않고 새로운 속성 추가된다


// 객체 리터널(이니셜라이저)를 이용한 객체생성 2
let obj2 = {};//빈객체

console.log(obj2); // 내용없음

// 실행시 동적으로 속성추가
obj2.subject = '자바';
console.log(obj2.subject);

//객체 리터널(이니셜라이저)를 이용한 객체생성 3




let obj3 = {
		name : '홍길동',
		age : 20,
		state : function(){
			return this.age>=19?'성인':'미성년자';
		},
		msg : function(){
			// 메소드안에서 속성 및 다른 메소드를 호출할때 this 생략불가
			var s = `${this.name}님은 ${this.state()}입니다`;
			console.log(s);
		}
		
	}; 

console.log(obj3);
obj3.msg();

생성자
생성자 함수를 이용한 obj생성

// 생성자 함수를 이용한 객체 생성

// 생성자 함수 작성 - 생성자는 대문자로 시작한다

function User(name,age){
	this.name = name;
	this.age = age;
	
	this.state = () => this.age>=19?'성인':'미성년자';

	
	this.msg =  () => {
		var s = this.name + '님은 ' + this.state() + '입니다';
		console.log(s);
	} 
}

var obj = new User('홍길동',20);
console.log(obj.name);
obj.msg();


// Object.create()메소드를 이용한 객체생성
var Book = {
		subject:'자바',
		msg:function(){
			return '좋아하는 과목은'+this.subject+'입니다';
		}
};

console.log(Book.msg());

var b1 =  Object.create(Book);
var b2 =  Object.create(Book);
b1.subject = 'HTML';
b2.subject = 'CSS';

console.log(Book.msg());//자바
console.log(b1.msg());//HTML
console.log(b2.msg());//CSS

let obj = { // 객체 생성
		name : '김자바',
		msg : function(){
			console.log(this.name);// this는 msg() 메소드를 호출한 객체
		}
}

obj.msg();

//생성자 함수를 호출할 때의 this : 새로 생성되는 객체
function Test(arg){
	this.name = arg;
	this.getName =  this.name;
}

instanceof
상위 객체 여부 확인

var obj = new User('홍길동');
console.log(obj instanceof User);// true
console.log(obj instanceof Object);// true User의 상위 객체는 Object

let obj = {
		name: '자바'
		,city:'서울'
};

console.log(obj.name);
console.log(obj.age);// 없는 속성은 undefined 에러가 아님

obj.age=10; //프로퍼티 추가 가능

delete obj.city; // 삭제
console.log(obj.city);

console.log(obj.age);

obj 접근

var obj = {
	name:'이자바'
	,age:20
	,msg:function(){
		return this.age>19?'성인':'미성년자';
	}
	
};

//객체 속성 접근
console.log(obj.name);
console.log(obj['name']);//대괄호 표기법으로 접근

console.log(obj.msg());

for(var ob in obj){ //ob: 프로퍼티명
	console.log(ob,obj[ob]);
}

console.log('name'in obj);//true 프로퍼티 존재여부확인

//with 로 접근
with(obj){
	console.log(name);
	console.log(age);
}

🔔쓰면서

매일 쓰던 방식만 사용해서 생성했는데 여러방식으로 생성해보고 결과를 보고 정리하면서 한번씩 다시 새겨보는 기회가 되는거같다

🔔마치며

조금씩 알아가면서 앞으로 나아가자