function
키워드를 사용function Person(name, age){
console.log(this);
this.name = name;
this.age = age;
};
const p = new Person('Mark', 37);
console.log(p, p.name, p.age);
/* Person{}
Person{name:'Mark', age:37} 'Mark' 37 출력 */
const a = new Person('Anna', 26);
console.log(a, a.name, a.age);
/*Peson{}
Person{name:'Anna', age:26} 'Anna' 26 출력 */
const Cat = (name, age) => { // arrow function 에서는 this 생기지 않는다
console.log(this);
this.name = name;
this.age = age;
};
const c = new Cat('냥이',1);
/* error: Cat is not a constructor()
Cat 내에 this 없기 때문에 객체가 아니어서 불가 */
function plus(base){
return function(num){
return base + num;
};
};
const plus5 = plus(5); // base = 5
console.log(plus5(10)); // num = 10
// 15 출력(5 + 10 이라서)
function hello(c){
console.log('hello');
c(); // 인자가 실행될 자리를 마련
}
hello(function() { // c에 해당되는 함수
console.log('콜백');
});
// hello 콜백 출력
function A() {}
const a = new A();
console.log(a, typeof a);// A {} object 출력
console.log(A());// undefined 출력(원래 return 값을 가져온다)
function B(name, age){
console.log(name, age);
}
// 객체가 생성될때도 함수가 실행된다
const b = new B(); // undefined undefined 출력
const c = new B('Mark', 37);// Mark 37 출력
console.log(B());
/* undefined undefined undefined 출력
객체 생성으로 2개 찍히고, console 실행으로 1개 찍히고*/
// 값을 속성으로 넣기
function A(){
this.name = 'Mark'; // this 객체를 의미
}
const a = new A();
console.log(a); // {name: 'Mark'} 출력
// 함수를 속성으로 넣기
function B(){
this.hello = function(){
console.log('hello');
}
}
(new B()).hello(); // hello 출력
new B().hello(); // hello 출력(괄호 생략 가능)
: Object 객체 만들기, 권장되는 방법은 아님
const a = new Object();
console.log(a, typeof a);
// {} object 출력
const b = new Object(true);
console.log(b, typeof b);
// [Boolean: true] object 출력
const c = new Object({name : 'Mark'});
console.log(c, typeof c);
// { name: 'Mark' } object 출력
function Person(name, age){
this.name = name;
this.age = age;
// this.hello = function(){ //객체로 생성되어야 사용할 수 있는 함수
// console.log('hello', this.name, this.age);
// };
}
Person.prototype.hello = function(){
console.log('hello', this.name, this.age);
};
const p = new Person('Mark', 37);
p.hello();// hello Mark 37 출력
console.log(p.toString());// [object Object] 출력
console.log(Person.prototype);// Person { hello: [Function] } 출력
console.log(Person.prototype.toString);// [Function: toString] 출력
console.log(Person.prototype.constructor);// [Function: Person] 출력
console.log(Person.prototype.hello);// [Function]
console.log(Object.prototype);// {}
console.log(Object.prototype.toString);// [Function: toString]
console.log(Object.prototype.constructor);// [Function: Object]
console.log(p instanceof Person);// true
console.log(p instanceof Object);// true 출력?!
/* p 객체는 Person 에서 나왔는데 Object 로부터
prototype 체인을 받아온 후에 설정한 hello 함수와 속성을 가지고 있다는 의미*/
function Person(){}
Person.prototype.hello = function(){
console.log('hello');
};
function Korean(region){
this.region = region;
this.where = function(){
console.log('where', this.region);
};
}
Korean.prototype = Person.prototype; // Person hello 함수를 가져올 수 있다
const k = new Korean('Seoul')
k.hello() // hello
k.where() // where Seoul
console.log(k instanceof Korean);// true
console.log(k instanceof Person);// true
console.log(k instanceof Object);// true
/* Korean 가장 근접한 관계
Person 내에 Object 로부터 받은 여러 prototype chain 존재*/
: 객체를 만들때 값을 직접 쓰는 방식
const a = {};
console.log(a, typeof a);// {} object
const b = {name: 'Mark'}
console.log(b, typeof b);// {name: 'Mark'} object
const c = {
name: 'Mark',
hello1(){
console.log('hello1', this.name);
},
hello2: function(){
console.log('hello2', this.name);
},
hello3: () => {
console.log('hello3', this.name);
}
}
c.hello1()// hello1 Mark
c.hello2()// hello2 Mark
c.hello3()// hello3 undefied (this 가져오지 못한다)
: 이미 만들어져 있는 키워드(Object, new function etc)
const a = new Array('red','black','white');
console.log(a, typeof a);// ['red','black','white'] 'object'
console.log(a instanceof Array);// true
console.log(a instanceof Object);// true
const b = ['red','green','yellow'];// 리터럴 표현법으로도 생성 가능
console.log(b, typeof b);// ['red','green','yellow'] 'object'
console.log(b instanceof Array);// true
console.log(b instanceof Object);// true
// Array 내에 들어있는(프로토타입 체인) 함수 사용가능(slice)
console.log(b.slice(0,1));// ['red']
console.log(Array.prototype.slice)// [Fuction: slice]
console.log(Object.prototype.slice)// undefined