본문 바로가기

JavaScript

call by value, 생성자

반응형

1. call by value, call by reference, call by sharing

 

let obj = {a:1,b:2};

let obj2 =Object.assign({}, obj);
obj2
//{a: 1, b: 2}
//a: 1b: 2__proto__: Object
//1단계깊은복사

JSON.parse(JSON.stringify(obj))
//{a: 1, b: 2}a: 1b: 2__proto__: Object
//완전한 깊은복사, 성능이 안좋다, 프로토타입을 복사할 수 없다

 

function 함수(매개변수){
    매개변수 = 10;
    console.log(매개변수);
}

let 인자 = 5;
함수(인자);
console.log(인자);

//10
//5

 

- 원시 값은 복사가 돼서 매개변수에 들어간다.

 

function 함수(매개변수){
    매개변수.a = 10;
    console.log(매개변수);
}

let 인자 = {a:5};
함수(인자);
console.log(인자);

//{a: 10}
//{a: 10}

 

- 객체는 참조가 되어, 본래 인자의 a값도 함수 내부의 10으로 바뀐다.

 

원시 값은 call by value, 객체는 call by reference로 동작한다 - 이것은 오개념이다.

- call by value - 원시 값, 객체 모두 콜 바이 밸류다.

- call by reference는 자바스크립트에 없다.

 

↓반례

 

function 함수(매개변수){
    매개변수 = 8;
    console.log(매개변수);
}

let 인자 = {a:5};
함수(인자);
console.log(인자);

//8
//{a: 5}

 

- 객체 속성 수정 시에는 참조이지만 객체 자체를 수정할 시에는 관계가 깨진다.

- 참조 관계가 있긴한데, 매개변수 자체를 바꿀때는 참조관계가 깨진다.

=> call by reference가 아니다!

 

2. 생성자

 

//1. 팩토리패턴
let prototype ={
    type:'카드',
}
function 카드공장(name, att, hp){
    let 카드 = Object.create(prototype);
    카드.name = name;
    카드.att = att;
    카드.hp = hp;
    return 카드;
}

//2. 생성자패턴 - 객체지향 사용할 때 많이 사용
function Card(name, att, hp){
    this.name = name;
    this.att = att;
    this.ho = hp;
}
Card.prototype = prototype;
//{type: "카드"}

let 희연 = new Card('희연', 10,10);

희연
//Card {name: "희연", att: 10, ho: 10}

 

- 팩토리 패턴과 거의 비슷하다. 다른 점은 콘솔로 찍었을 때, 생성자 이름이 앞에 붙는다. (card)

- 생성자를 사용할 때는 new를 꼭 붙여야 한다. 

- this는 window다.

-  함수 내부에서 'use strict'을 작성하면 new를 붙이지 않았을 때, 에러가 생기는 것을 확인할 수 있다.