객체 지향 프로그래밍의 자바 스크립트 JS를 (객체를 생성) 다시 배우기

참고 : 같은이 문서를 장 V 시리즈 참조 형 [자바 스크립트] "자바 스크립트 JS 고급 프로그래밍의 과학".
"다시 배우는 자바 스크립트 JS 고급 프로그래밍"에 대해 JS 기반 학습을 방문하는 것입니다.

1. 객체 지향 무엇입니까

객체 지향 언어는 클래스의 개념을 가지고 표시이다, 당신은 클래스를 통해 동일한 속성과 메소드와 객체의 수를 만들 수 있습니다. 그러나 나는 이전에 언급. ES는 클래스의 개념이 없다, 그래서 그것은 또한 다른 객체와 클래스 기반 언어의 객체입니다.

개체 정의 : 속성이 기본 값, 객체 또는 함수를 포함 할 수있다 '정렬되지 않은 속성. '엄밀히 말하자면,이 개체는 특정 순서 값들의 집합 인 것을 말하는 것과 같다. 객체의 각 속성 또는 방법 이름을 가지며, 각각의 이름 값으로 매핑된다. 값이 데이터 또는 함수가 될 수있는 이름 - 값 쌍의 집합에 지나지 : 그래서 우리는 ES 오브젝트의 해시 테이블을 상상할 수 있습니다.

각 객체가 참조 형식에 기초하여 생성되고, 상기 기준 입력은 사용자 정의 타입 일 수 있고, 이전 장에서 설명 원시적 수있다.

2. 개체 만들기

가장 쉬운 방법은 객체의 인스턴스를 생성 한 다음에 속성과 메소드를 추가하는 것입니다.

let p = new Object()
p.name = 'js'
p.age = 20
p.job = 'jizhe'

p.sayName = function() {
    alert(this.name)
}

p.sayName()  // js

3. 공장 패턴

공장 패턴 : 특정 개체를 만드는 추상적 과정. 배아 줄기의 세부 사항을 고려하면 클래스를 생성, 그래서 그는 특정 인터페이스 객체를 생성하는 특정 기능을 캡슐화하는 데 사용 할 수 없습니다.

function p(name, age, job) {
    let o = new Object()
    o.name = name
    o.age = age
    o.job = job
    o.sayName = function() {
        alert(this.name)
    }
    return o
}

let p1 = p('tc', 30, '老宋')
let p2 = p('bd', 22, '百度')

p1.sayName  // tc
p2.sayName  // bd 

함수 P ()는 수신 된 파라미터에 기초하여 필요한 정보를 생성하기 위해 사람 개체 일 수 포함한다. 우리는이 함수를 여러 번 호출 할 수 있으며, 각 시간은이 세 가지 속성의 방법을 포함하는 객체를 반환합니다. 공장 모드는 여러 유사한 객체를 생성의 문제를 해결하지만, 물체 인식의 문제가 해결되지 않는 (즉, 객체의 유형을 찾는 방법)

4. 생성자 모드

도입 이전 장에서, ES 생성자는 객체의 특정 유형을 만드는 데 사용할 수 있습니다. 기본 생성자 객체 및 배열과 마찬가지로, 런타임은 자동으로 실행 환경에 나타납니다. 또한, 함수 정의를 작성하는 사용자 객체 속성 및 방법의 타입을 정의하도록 구성 될 수있다. 다음과 같습니다 :

function p(name, age, job) {
    this.name = name
    this.age = age
    this.job = job
    this.sayName = function (){
        alert(this.name)
    }
}

let p1 = new P('tc', 33, 'haha')
let p2 = new P('gg', 32, '小夭同学')

p1.sayName() // haha
p2.sayName() // 小夭同学

위의 예에서, P () 함수는 짧은 치환기의 함수이다. 동일한 코드의 내용 외에도 다음과 같은 차이점이있다 :

  • 명시 적으로 객체를 생성하지 않았나요
  • 직접 속성 및 오브젝트의 메소드에 할당
  • 어떤 retrun 문 없다
  • 또한 함수 p는 대문자. 항상 첫 글자로 시작하는 생성자는 대문자로. 비 생성자의 시작을 소문자.

당신이 P 인스턴스를 생성 할 경우에도, 당신은 생성자가 실제로 다음의 네 단계를 받게 될 것이다 부르는 방식으로, new 연산자를 사용합니다 :

  • 새로운 객체를 생성
  • 생성자의 범위 (새로운 개체에 따라서이 점)가 새로운 객체를 할당
  • 코드 생성자 (개체의 속성을 추가) 실행
  • 새로운 오브젝트를 돌려줍니다

객체의 constructor 속성은 원래 객체의 유형을 식별하는 데 사용됩니다. 하지만, 검출 기준 개체 유형, instanceof는 운전자는보다 안정된다.

instanceof 判断某个对象是否属于另外一个对象的实例

장점 : 공장 모드는 특정 유형의 인스턴스로 식별 할 수 있습니다 생성자 모드에 비해.

참고 : 생성자가이 방식으로 정의되고있는 경우는에 정의되어 글로벌 객체 , 따라서, 별도로 명시하지 않는 한, 사업자 instaceof 및 construcotr 속성은 항상 있다고 가정 전역 범위의 쿼리 생성자입니다.

4.1 생성자 함수

생성자와 다른 기능 사이의 유일한 차이는, 그들은 다른 방법을 호출한다는 것입니다. 그러나, 생성자도 함수, 존재하지 않는 생성자를 정의하는 특수 구문입니다. 새로운 운영자에 의해 호출 한, 다음은 생성자로 사용할 수있는 모든 기능, 새로운 운영자에 의해 호출, 그리고하지 않을 경우 어떠한 기능, 그것은 일반적인 기능은 다른 촬영하지 않습니다.

// 构造函数调用
let p = new Person('tc', 22, '哈哈哈')
p.sayName   // tc

// 普通函数调用
P('gc', 23, 'oo')  // 添加到 window
windwo.sayName  // gc

// 在另外一个对象的作用域中调用
let o = new Object()
P.call(o, 'new', 33, 'suzhou')
o.sayName   // new

4.2 생성자 문제

간단하지만 생성자는 사용하지만, 단점도 있습니다. 주요 문제는 각각의 각 인스턴스에 다시 재 작성되는 생성자 메소드를 사용한다는 것이다.

프로토 타입 모델

우리는 시간의 함수를 만들 때마다 개체에 대한 포인터입니다 프로토 타입 속성이 있습니다. 이 객체는 특정 유형의 모든 인스턴스에있어서 공유 할 수있는 특성 및 방법의 사용이다. 그 목적은 말 그대로, 다음 프로토 타입 인스턴스의 생성자를 호출하여 생성 된 경우 프로토 타입 객체입니다. 프로토 타입 객체를 사용의 이점은 모든 속성과 객체의 방법은 공유의 예를 포함를 제공한다는 것입니다. 즉, 구성 정보는 더 이상 정의 오브젝트 인스턴스를 작동,하지만이 정보는 프로토 타입 객체에 직접 추가 할 수 있습니다.

5.1 프로토 타입 객체를 이해

언제든지, 단순히 규칙의 특정 세트, 프로토 타입 객체 기능이 속성 포인트에 따라 속성 함수의 프로토 타입을 만드는 것, 새로운 한 슈를 만들 수 있습니다. 기본적으로 모든 자동있는 함수 프로토 타입 속성에 대한 포인터에 대한 포인터를 포함하는 프로토 타입 객체 생성자 생성자 속성을 얻을 수 있습니다. 이 생성자, 우리는 추가 프로토 타입 객체의 속성과 메소드를 계속 추가 할 수 있습니다.

사용자 정의 생성자를 생성 한 후, 프로토 타입 객체는 기본 생성자 속성을 얻을 것이다, 다른 방법에 관해서는, Object에서 상속됩니다. 생성자를 호출의 새로운 인스턴스를 생성 할 때,이 예제의 내부 포인터 (내부 속성), 점 프로토 타입 객체에 생성자가 포함되어 있습니다. 많은 구현에서 속성의 이름은 내부 프로토 다른 구현에서, 스크립트의 속성이 완전히 보이지 않는 상태에서, 그리고 스크립트를 통해 액세스 할 수 있습니다. 그러나 정말 중요한 선택을 취소하면이 연결이되지 사이에서 인스턴스 생성자에서 프로토 타입 객체 생성자에서 인스턴스 사이에 존재한다는 것입니다

또한, 코드는 개체의 속성을 읽을 때마다, 검색을 수행 할 것, 목표는 주어진 이름의 속성을 가지고있다. 객체 인스턴스 자체로 시작하는 검색 할 수 있습니다. 당신이 예를 지정된 이름의 속성을 찾을 경우, 속성의 값이 반환되고, 발견되지 않는 경우는, 검색이 프로토 타입의 형성에 지정된 이름의 속성을 찾아, 프로토 타입 객체 포인터를 계속한다. 당신이 프로토 타입 객체에이 속성을 발견하는 경우, 속성의 값이 반환됩니다. 우리 모두의 첫번째 검색이 두 번 연속적으로 수행 될 p.sayName ()를 호출 할 것을 파서가 묻습니다 : P 인스턴스 sayName 속성이 아닌 경우, 프로토 타입 P 속성을 물어이 sayName 음이 존재하는 경우, 함수는 프로토 타입 객체가 읽기에 저장합니다.

액세스 값이 아닌 프로토 타입 객체 인스턴스 재 작성의 가치에 의하여, 객체 인스턴스로 프로토 타입에 저장되어 있지만. 우리는 인스턴스에 속성을 추가하고 속성이 프로토 타입의 인스턴스와 동일한 이름의 속성 인 경우, 우리는 예제의 속성을 만들 수 있으며,이 건물은 프로토 타입의 속성을 차단합니다.

5.2 시제품 및 연산자

혼자를위한 루프의 : 연산자를 사용하는 방법은 두 가지가 있습니다. 단독으로 사용되는 경우, 소정의 속성이 객체에 해당 통해 액세스 할 수있는 경우에 관계없이 재산권 원형 예에 존재 여부, 오퍼레이터에 반환한다. 속성으로 인해에서 운전자 되돌아가 참으로 객체만큼 액세스 할 수있는 경우, 속성은 예를 들어 존재하는 경우에만, hasOwnProperty ()가 오랫동안 오퍼레이터 hasOwnProperty ()에서 true를 반환으로 false를 반환 true를 반환하고, 특성이 결정될 수있다 프로토 타입 속성입니다.

참고 : 사용하는 경우 루프에 대한-, 개체에 액세스 할 수 있습니다 통해 반환 속성이 프로토 타입에 존재하는 속성을 포함한 속성 인스턴스에 존재하는 모두를 포함하여 열거 할 수있다. 예를 열거 속성에 프로토 타입의 속성을 차폐하는 루프에 대한-반환하지 않습니다.

5.3 더 간단한 프로토 타입 구문

일반적인 방법을 포함하고, 불필요한 입력 나은 시각적 함수 원형 패키지를 줄이기 위해 건물 전체를 대상 문자 프로토 타입 객체를 재 작성하는 방법을 말한다.

function P(){
    
}

P.prototype = {
    name: 'tc',
    age: 22,
    job: 'web',
    sayName: function(){
        console.log(this.name)
    }
}

5.4 동적 프로토 타입

프로토 타입의 검색 프로세스의 값 때문에 검색, 그래서 우리는 프로토 타입 객체에 대한 변경 사항은 즉시 인스턴스에서 반영 할 수 있습니다. 당신은 항상 프로토 타입 속성과 메서드를 추가 할 수 있지만 수정은 즉시에있는 모든 개체 인스턴스에 반영 될 수 있지만, 전체 프로토 타입 객체를 다시 작성하는 경우, 다음 상황은 다르다. 또한, 예를 들어 생성자를 호출 __proto__ 프로토 타입을 초기 가리키는 포인터를 추가하고, 다른 객체가 생성자와 초기 프로토 타입 사이의 통신을 차단에 프로토 타입이 동등 수정하는 것 같이. 뿐만 아니라 생성자 프로토 타입 예에 대한 포인터.

5.5 프로토 타입 기본 객체

프로토 타입 모델의 중요성은이 모델을 사용하여 생성, 사용자 정의 형식의 생성, 심지어 모든 기본 참조 형식에 반영되지 않습니다. 모든 기본 참조 형 (객체, 배열, 문자열) 프로토 타입 생성자의 방법을 정의합니다.

typeof Array.prototype.sort     // function
typeof String.prototype.substring   // function

네이티브 객체를 프로토 타입으로 기본 참조 모든 방법, 새로운 방법도 정의 할 수 있습니다 얻을 수 있습니다뿐만 아니라. 사용자 정의 개체의 프로토 타입을 수정 프로토 타입처럼, 언제든지 방법을 추가 할 수 있습니다처럼 당신은 네이티브 개체를 수정할 수 있습니다.

중요 :이 작업을 수행 할 수 있지만,이 프로그램의 제품에 프로토 타입 기본 개체를 수정하지 않는 것이 좋습니다 있지만. 때문에 방법의 구현의 부족으로,이 방법은 프로토 타입에서 기본 객체를 추가 할 경우, 다른 지원의 실현이 방법을 코드를 실행하면 다음은 이름 충돌이 발생할 수 있으며, 그렇게 할 수있다 할 실수로 네이티브 메소드를 덮어 쓰기

5.6 프로토 타입 객체 문제

프로토 타입 모델은 단점이 있습니다 첫째, 그것은 생성자의이 부분을 통과 초기화 매개 변수, 결과는 같은 속성 값 기본의 모든 경우에 달성 될 것이다 생략합니다. 이 어느 정도 불편을 가져왔다,하지만 가장 큰 문제는 그 성질에 의해 공유되는 동안이 발생합니다.

프로토 타입, 모든 속성이 많은 경우에 의해 공유되는, 이러한 기능은 공유를위한 매우 적합합니다. 또한 기본 값을 포함하는 속성 만 참조 유형 속성 값이에 대한 사람들을 위해, 문제가있는 것입니다.

6. 모델과 프로토 타입 모델 생성자의 조합

사용자 정의 유형 가장 일반적인 방법을 만들기 모델 및 프로토 타입 생성자 모드의 조합을 사용하는 것입니다. 인스턴스 속성에 대한 모델 생성자가 정의되고 프로토 타입 모델은 방법과 공유 속성을 정의하는 데 사용됩니다. 각 인스턴스의 결과는 인스턴스 속성의 복사본을 가지고 있지만 동시에 저장 메모리를 극대화하는 방법을 참조하여 공유됩니다.

7. 동적 프로토 타입 모델

약간의 프로토 타입 생성자의 사용을 유지하면서 생성자, 프로토 타입을 초기화하여 그것은 생성자에서 모든 정보를 캡슐화합니다. 즉 프로토 타입을 초기화 할 것인지 여부를 결정하기 위해, 유효한이 있어야 여부를 확인하는 방법이 될 수 있습니다.

function P(name, age, job) {
    this.name = name
    this.age = age
    this.job = job
    
    if(typeof this.sayName != 'function') {
        P.prototype.sayName = fucntion() {
            console.log(this.name)
        }
    }
}

let p = new P('tc', 23, 'web')
p.sayName() //  tc

sayName () 메소드는 프로토 타입에 추가하기 전에 존재하지 않는 경우에만 위의 코드입니다. 첫 번째 호출 기능이 수행됩니다에만이 코드. 프로토 타입 후 추가 수정하지 않고, 초기화되었습니다. 프로토 타입으로 만들어 이러한 수정은, 모든 경우에 즉시 반영 할 수 있습니다. 모든 추가 속성 또는 메서드는 초기화 후 문 검사가 존재할 수있는 경우.

참고 : 동적 프로토 타입 모드를 사용하면, 객체 리터럴 재 작성 프로토 타입을 사용할 수 없습니다 프로토 타입을 재 작성의 경우 인스턴스를 생성 한 경우, 그것은 기존 및 신규 프로토 타입 인스턴스 사이의 연결이 끊어집니다.

제 스퓨리어스 모드 생성자

함수를 만들고, 그 함수는 패키지 코드는 객체를 생성하는 않는 경우에만 다음 새로 생성 된 객체를 반환합니다.

참고 : 생성자의 프로토 타입 속성 기생 모드 사이의 관계는 객체의 생성자를 반환 또는 생성자에 없다, 즉, 객체와 객체 생성자 반환 생성자가 다를를 생성하지 않습니다 밖에. 이를 위해 instanceof를 연산자를 결정할 수있다 객체의 유형에 의존 할 수 없다.

9. 생성자 보안 모드

이러한 오브젝트에 대한 연산자가 아무런 의미가없는 instanceof는 유사하므로 기생 생성자 모드, 안전 모드 생성자 생성자를 사용하여 생성 된 오브젝트 간의 관계 없다.


공공 입찰 소수에 오신 것을 환영합니다 관심 [학생]

시리즈의 js를 배우기 다시

자바 스크립트 JS에 대한 소개를 다시 배우기

JS 상기 HTML에서 자바 스크립트의 사용을 다시는 배우기

의 기본 개념 자바 스크립트 JS (에) 다시 배울 => 데이터 유형

의 기본 개념 자바 스크립트 JS 재 - 학습 (에서) => 연산자

JS 자바 스크립트의 기본 개념을 다시 배울 (저급) => 연산자

JS는 자바 스크립트 변수, 범위 및 메모리 문제를 다시 배우기

자바 스크립트 참조의 유형을 재 배우기

ES6 시리즈 시작하기

ES6이하자 얻기 계속

ES6의 해체 할당 변수 항목

프라이머 확장 문자열 ES6

정규 엔트리 ES6의 확장

ES6의 확장 수치 입력

프라이머 확장 기능 ES6

프라이머 확장 배열 ES6

ES6의 확장 개체 항목

ES6 기호를 얻기

망할 놈의 튜토리얼

전면 힘내 기본 튜토리얼

추천

출처www.cnblogs.com/lieone/p/11562529.html