JavaScript 객체

// 생성자 함수

function A() {}

const a = new A();
console.log(a, typeof a);
console.log(A());

 

결과

A()에 return값이 없어서 undefined라고 나온다.

 

// 생성자 함수

function A() {}

const a = new A();
console.log(a, typeof a);
console.log(A());

// 생성하면서 데이터 넣기
function B(name, age) {
    console.log(name, age);
}

const b = new B();//객체 생성
const c = new B('Mark', 27);
console.log(B());

 

결과

 

 

// 값을 속성으로 넣기

function A() {
    this.name = 'Mark';
}

const a = new A(); // {name : 'Mark'}
console.log(a);

// 함수를 속성으로 넣기

function B() {
    this.hello = function() {
        console.log('hello');
    }
}

(new B()).hello();

// new Funcrion()

 

결과

 

// new Object

const a = new Object();

console.log(a, typeof a);

const b = new Object(true);

console.log(b, typeof b);

const c = new Object({name : 'Mark'});
console.log(c, typeof c);

결과

 

Prototype이란?

참고 사이트 : www.nextree.co.kr/p7323/

// prototype

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();
console.log(p.toString());

console.log(Person.prototype);
console.log(Person.prototype.toString);
console.log(Person.prototype.constructor);
console.log(Person.prototype.hello);

console.log(Object.prototype);
console.log(Object.prototype.toString);
console.log(Object.prototype.constructor);

console.log(p instanceof Person);// p 가 Person에서 나온거냐 아니냐 true false 반환
console.log(p instanceof Object);// p 가 Object에서 나온거냐 아니냐 true false 반환

결과

 

// prototype

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();
console.log(p.toString());

console.log(Person.prototype);
console.log(Person.prototype.toString);
console.log(Person.prototype.constructor);
console.log(Person.prototype.hello);

console.log(Object.prototype);
console.log(Object.prototype.toString);
console.log(Object.prototype.constructor);

console.log(p instanceof Person);// p 가 Person에서 나온거냐 아니냐 true false 반환
console.log(p instanceof Object);// p 가 Object에서 나온거냐 아니냐 true false 반환

 

결과

 

// prototype 상속

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;

const k = new Korean('Seoul');

k.hello();
k.where();

console.log(k instanceof Korean);
console.log(k instanceof Person);
console.log(k instanceof Object);

결과

 

// 객체 리터럴

const a = {};

console.log(a, typeof a);

const b = {
    name : 'Mark'
};

console.log(b, typeof b);

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();
c.hello2();
c.hello3();

arrow function 은 this 바인드가 안됨

결과

// 표준 내장 객체 : Array

const a = new Array('red', 'black', 'white');

console.log(a, typeof a);
console.log(a instanceof Array);
console.log(a instanceof Object);

const b = ['red', 'green', 'yellow'];

console.log(b, typeof b);
console.log(b instanceof Array);
console.log(b instanceof Object);

console.log(b.slice(0,1));
console.log(Array.prototype.slice, Object.prototype.slice);

결과