(JavaScript) 객체 생성자 함수

(JavaScript) 객체 생성자 함수

- 함수를 new 연산자를 통하여 객체화 시키는 것

- var, let 키워드로 내부에 변수나 내부함수 선언시 외부에서 접근 불가능 > java의 private과 비슷

- this 키워드로 내부 변수나 함수(메서드) 선언시 외부에서 접근 가능 > java의 public과 비슷

새로 생성된 객체의 값 바꾸기

function MyFn2(){//클래스처럼 생각하기 //객체화된 나 자신의 속성 생성 this.userName = '홍길동'; //객체화된 나 자신의 메서드 생성 this.getUserName = function(){ }; } var myFnObj = new MyFn2(); myFnObj.userName = '홍길순'; console.log(myFnObj, new MyFn2().userName); var myFnObj2 = new MyFn2(); myFnObj2.userName = '유관순'; console.log(myFnObj2, new MyFn2().userName);

결과 :

var(let)와 this의 차이

function MyFn(){//클래스처럼 생각하기 var userName = '이순신'; //객체화된 나 자신의 속성 생성 this.userName = '홍길동'; //객체화된 나 자신의 메서드 생성 this.getUserName = function(){ }; } var obj = new MyFn(); console.log(obj.userName);

결과 :

'이순신'은 MyFn()함수의 지역변수로 선언되어 있어 외부에서 접근이 불가능하다.

같은 객체 내에선 지역변수에도 접근할 수 있기 때문에

MyFn() 함수에 익명함수로 선언되어 있는 메서드를 이용하여 호출해야 한다.

9~10번 줄 코드를 아래의 코드로 수정한 뒤 console.log()를 이용하여

getUserName()메서드를 출력하면 '이순신' 결과값을 확인할 수 있다.

this.getUserName = function(){ return userName; }; console.log(obj3.getUserName());

결과 :

구조가 같은 객체를 많이 만들어야 할 때

일반 객체 생성 객체 생성자 함수로 객체 생성 var obj = [

{name: '홍길동', age: 20},

{name: '이순신', age: 20},

{name: '고길동', age: 20},

{name: '유관순', age: 20},

];

function UserInfo(name, age){

this.name = name;

this.age = age;

}

var obj2 = [

new UserInfo('홍길동',20),

new UserInfo('이순신',20),

new UserInfo('고길동',20),

new UserInfo('유관순',20),

];

지금은 객체 안의 멤버가 적어 차이가 잘 보이지 않지만

일반 객체 생성시에는 키를 일일히 써줘야 하는 반면,

객체 생성자 함수로 객체 생성시 매개변수 형태로 값만 써주면 된다

from http://everyday-com-eat.tistory.com/47 by ccl(A) rewrite - 2021-12-23 17:27:20