JavaScript 객체 생성자

인스턴스

생성자 함수는 대문자로 이름을 지정하는 것이 좋습니다.
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
}

직접 시도해보세요

생성자 함수를 대문자로 이름을 지정하는 것이 좋습니다.

객체 타입(플랜트)(클래스)

전一章의 예제는 제한적입니다. 그들은 단일 객체만 생성합니다.

때로는 동일한 "타입"의 많은 객체의 "플랜트를 사용하는 것입니다.

객체 "타입"을 생성하는 방법은객체 생성자 함수。

위의 예제에서function Person(first, last, age, eye) { 이 객체 생성자 함수입니다.

를 통해 new 키워드를 호출하면 동일한 유형의 객체를 생성할 수 있습니다:

var myFather = new Person("Bill", "Gates", 62, "blue");
var myMother = new Person("Steve", "Jobs", 56, "green");

직접 시도해보세요

this 키워드로 알려져 있습니다.

JavaScript에서 this 의 것은 코드의 "소유자"입니다.

this 의 값은 객체를 사용할 때 객체 자체입니다.

생성자 함수에서this 값이 없습니다. 새로운 객체 대체물입니다. 새로운 객체가 생성될 때마다 this의 값은 이 새로운 객체가 됩니다.

주의하세요 this 그것은 변수가 아닙니다. 키워드입니다. this의 값을 변경할 수 없습니다.

객체에 속성 추가

기존 객체에 새로운 속성을 추가하는 것은 매우 간단합니다:

인스턴스

myFather.nationality = "English";

직접 시도해보세요

새 속성은 myFather에 추가되었습니다. myMother도 아니고, 어떤 다른 person 객체도 아닙니다.

객체에 메서드 추가

기존 객체에 새 메서드를 추가하는 것은 매우 간단합니다:

인스턴스

myFather.name = function () {
    return this.firstName + " " + this.lastName;
};

직접 시도해보세요

새 메서드는 myFather에 추가되었습니다. myMother도 아니고, 어떤 다른 person 객체도 아닙니다.

구조자에 속성 추가

기존 객체에 새로운 속성을 추가하는 것과 달리, 객체 구조자에 새로운 속성을 추가할 수 없습니다:

인스턴스

Person.nationality = "English";

직접 시도해보세요

구조자에 새로운 속성을 추가하려면, 구조자 함수에 추가해야 합니다:

인스턴스

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    this.nationality = "English";
}

직접 시도해보세요

이렇게 하면 객체 속성에 기본 값이 설정될 수 있습니다.

구조자에 메서드 추가

귀하의 구조자 함수도 메서드를 정의할 수 있습니다:

인스턴스

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
    this.name = function() {return this.firstName + " " + this.lastName;};
}

직접 시도해보세요

기존 객체에 새 메서드를 추가하는 것과 달리, 객체 구조자에 새 메서드를 추가할 수 없습니다.

구조자 함수 내부에 하나의 객체에 메서드를 추가해야 합니다:

인스턴스

function Person(firstName, lastName, age, eyeColor) {
    this.firstName = firstName;  
    this.lastName = lastName;
    this.age = age;
    this.eyeColor = eyeColor;
    this.changeName = function (name) {
        this.lastName = name;
    };
}

changeName() 함수는 name 값을 person의 lastName 속성에 할당합니다.

이제 시도해 보세요:

myMother.changeName("Jobs");

직접 시도해보세요

이렇게 사용하여 myMother 대신 thisJavaScript는 현재 처리하는 person이 누구인지 알 수 있습니다.

내장 JavaScript 구조자

JavaScript는 원시 객체를 생성하는 용도로 사용할 수 있는 구조자를 제공합니다:

인스턴스

var x1 = new Object();    // 새로운 Object 객체
var x2 = new String();    // 새로운 String 객체
var x3 = new Number();    // 새로운 Number 객체
var x4 = new Boolean();   // 새로운 Boolean 객체
var x5 = new Array();     // 새로운 Array 객체
var x6 = new RegExp();    // 새로운 RegExp 객체
var x7 = new Function();  // 새로운 Function 객체
var x8 = new Date();      // 새로운 Date 객체

직접 시도해보세요

Math() 객체는 이 목록에 포함되지 않습니다. Math는 전역 객체입니다.new 키워드는 Math에서 사용할 수 없습니다.

알고 계신가요?

위와 같이 보면 JavaScript는 원시 데이터 타입 문자열, 숫자, 부울의 객체 버전을 제공합니다. 하지만 복잡한 객체를 생성할 이유는 없습니다! 원시 값은 훨씬 빠릅니다!

객체 리터럴 사용하십시오 {} 대신 new Object()。

문자열 리터럴 사용하십시오 "" 대신 new String()。

数值 리터럴 대신 사용하십시오 Number()。

부울 리터럴 대신 사용하십시오 new Boolean()。

배열 리터럴 사용하십시오 [] 대신 new Array()。

모드 리터럴 대신 사용하십시오 new RexExp()。

함수 표현식 사용하십시오 () {} 대신 new Function()。

인스턴스

var x1 = {};            // 새로운 객체
var x2 = "";            // 새로운 원시 문자열
var x3 = 0;             // 새로운 원시数值
var x4 = false;         // 새로운 원시 논리 값
var x5 = [];            // 새로운 배열 객체
var x6 = /()/           // 새로운 정규 표현식 객체
var x7 = function(){};  // 새로운 함수 객체

직접 시도해보세요

문자열 객체

보통, 문자열은 원시 값으로 생성됩니다: var firstName = "Bill"

하지만 다음과 같이 사용할 수도 있습니다 new 키워드로 문자열 객체를 생성하려면: var firstName = new String("Bill")

다음에 JS 문자열이 장에서는 문자열이 객체로 생성되지 않아야 하는 이유를 배웁니다.

숫자 객체

보통, 숫자는 원시 값으로 생성됩니다: var x = 456

하지만 다음과 같이 사용할 수도 있습니다 new 키워드로 숫자 객체를 생성하려면: var x = new Number(456)

다음에 JS 숫자이 장에서는 숫자가 객체로 생성되지 않아야 하는 이유를 배웁니다.

부울 객체

보통, 논리 값은 원시 값으로 생성됩니다: var x = false

하지만 다음과 같이 사용할 수도 있습니다 new 키워드로 논리 객체를 생성하려면: var x = new Boolean(false)

다음에 JS 논리이 장에서는 논리 값이 객체로 생성되지 않아야 하는 이유를 배웁니다.