>웹 프론트엔드 >JS 튜토리얼 >Javascript의 생성자 란 무엇입니까? 생성자 인스턴스 사용 방법에 대한 자세한 설명

Javascript의 생성자 란 무엇입니까? 생성자 인스턴스 사용 방법에 대한 자세한 설명

伊谢尔伦
伊谢尔伦원래의
2017-07-25 13:20:392210검색

생성자란 무엇인가요?

Java, C++, PHP와 같은 일부 객체 지향 언어에서는 생성자가 매우 일반적입니다. Javascript에서 생성자는 먼저 new 연산자를 사용하여 호출할 수 있고 특수 유형의 객체를 생성하는 일반 함수입니다.

// "Benjamin" is a constructor
var benjamin = new Benjamin("zuojj", "male");

위의 예에서 benjamin은 Benjamin 객체인데 어떻게 인스턴스화되나요?

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
var benjamin = new Benjamin("zuojj", "male");
//Outputs: Benjamin{sex: "male",username: "zuojj"}
console.log(benjamin);

보시다시피 "Benjamin" 생성자는 단순히 전달된 매개변수를 수신하여 this 개체에 할당합니다. 이는 new 연산자가 생성자를 호출할 때 생성자의 this 객체에 new 연산에서 반환된 객체가 할당되기 때문입니다.
위 코드는 다음과 같습니다.

benjamin = {
 "username": "zuojj",
 "sex": "male"
}

생성자를 사용하는 이유

생성자를 사용하는 이유는 다음과 같습니다.
1. 생성자를 사용하면 이러한 모든 객체가 동일한 기본 구조를 사용하여 생성될 수 있습니다
2 . 생성자를 사용한다는 것은 "benjamin" 객체가 "Benjamin" 함수

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
var benjamin = new Benjamin("zuojj", "male");
var ben = {
 "username": "zuojj",
 "sex": "male"
}
//Outputs: true
console.log(benjamin instanceof Benjamin);
//Outputs: false
console.log(ben instanceof Benjamin);

3의 인스턴스로 명시적으로 표시된다는 것을 의미합니다. 생성자를 사용한다는 것은 여러 인스턴스에서 공유하기 위해 프로토타입에 공용 메서드를 정의할 수 있다는 의미입니다.

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
Benjamin.prototype.getName = function() {
 return this.username;
}
var benjamin = new Benjamin("zuojj", "male");
var ben = new Benjamin("lemon", "female");
//Outputs: zuojj
console.log(benjamin.getName());
//Outputs: lemon
console.log(ben.getName());

3. 참고사항

1. new 키워드

생성자를 인스턴스화할 때 new 키워드를 사용하는지 여부는 이 개체에 큰 영향을 미칩니다. 이 개체는 전역 개체(브라우저의 창 및 노드의 전역)를 가리킵니다. 따라서 생성자를 정의할 때 함수 이름의 첫 글자를 대문자로 표기하는 것이 좋습니다.
2. 호출된 함수에 명시적인 반환 표현식이 없으면 암시적으로 이 개체, 즉 새로 생성된 개체를 반환합니다. 그렇지 않으면 반환된 결과에 영향을 주지만 개체를 ​​반환하는 경우에만

function Bar() {
    return 2;
}
var bar = new Bar();
//返回新创建的对象
//Outputs: Bar {} 
console.log(bar);
function Test() {
    this.value = 2;
    return {
        foo: 1
    };
}
var test = new Test();
//返回的对象
//Outputs: Object {foo: 1} 
console.log(test);

What 우리가 주목해야 할 점은:

a) new Bar()는 숫자의 리터럴 값 2가 아니라 새로 생성된 객체를 반환합니다. 따라서 new Bar().constructor === Bar이지만 숫자 객체가 반환되면 결과가 다릅니다;
b) 여기서 얻은 new Test()는 new 키워드를 통해 새로 생성된 것이 아니라 함수에 의해 반환된 객체입니다. 아래와 같은 개체:

function Bar() {
    return 2;
}
var bar = new Bar();
function BarN() {
 return new Number(2);
}
var barn = new BarN();
//Outputs: true
console.log(bar.constructor === Bar);
//Outputs: Number {} 
console.log(barn);
//Ouputs: false
console.log(barn.constructor === BarN);
//Outputs: true
console.log(barn.constructor === Number);
/* -------------------------------------- */
function Test() {
    this.value = 2;
    return {
        foo: 1
    };
}
var test = new Test();
//Outputs: undefined
console.log(test.value);
//Ouputs: 1
console.log(test.foo);

위 내용은 Javascript의 생성자 란 무엇입니까? 생성자 인스턴스 사용 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.