Javascript 고급 프로 그래 밍 - 독서 노트 대상 (1)

하하 하 만물 이 대상 이 되 어 마침내 js 대상 편 에 도착 했다.
속성 유형
(1) 데이터 속성
데이터 속성 은 데이터 값 의 위 치 를 포함 합 니 다. 이 위치 에서 수 치 를 기록 하고 읽 을 수 있 습 니 다. 데이터 속성 은 네 개의 설명 기 행동 의 특성 이 있 습 니 다.

[Configurable]: delete 를 통 해 속성 을 삭제 할 수 있 는 지 여 부 를 표시 합 니 다. 기본 값 은 ture

입 니 다.

[[Enumerable]: for - in 순환 을 통 해 이 속성 을 되 돌 릴 수 있 는 지, 기본 값 true

[Writable]: 속성 을 수정 할 수 있 는 값 을 표시 합 니 다. 기본 값 true

[Value]: 이 속성 을 포함 하 는 데이터 값, 기본 값 true

기본 속성의 특성 을 수정 하려 면 ECMAScript 의 Objedt. defineProperty () 방법 을 사용 해 야 합 니 다. 이 방법 은 함수 가 있 는 대상, 속성 이름과 설명 대상 세 가지 인 자 를 받 아들 여야 합 니 다.예.

1 var person = {};
2 Object.defineProperty(person,"name".{
3    writable:false,
4    value:"Nicholas"  
5 });
6 alert(person.name);    //Nicholas
7 person.name = "Greg";
8 alert(person.name);    //Nicholas

(2) 접근 기 속성
접근 기 속성 은 getter 와 setter 함 수 를 포함 합 니 다. 접근 기 속성 을 읽 을 때 getter 함 수 를 호출 합 니 다. 이 함 수 는 유효 치 를 되 돌려 줍 니 다. 접근 기 속성 을 기록 할 때 setter 함 수 를 호출 하여 새 값 을 입력 합 니 다. 이 함 수 는 수 치 를 어떻게 처리 하 는 지 결정 합 니 다. 방문 기 속성 은 다음 과 같은 4 가지 특성 이 있 습 니 다.

[[Configurable]]: delete 를 통 해 속성 을 삭제 하고 다시 정의 할 수 있 습 니까? 기본 값 은 true

입 니 다.

[[Enumerable]: for - in 순환 을 통 해 속성 을 되 돌 릴 수 있 는 지, 기본 값 은 true

[Get]: 속성 을 읽 을 때 호출 되 는 함수, 기본 값 true

[[Set]: 속성 을 쓸 때 호출 되 는 함수, 기본 값 true

접근 기 속성 을 직접 정의 할 수 없습니다. Obiect. defineProperty () 를 사용 하여 정의 해 야 합 니 다. 예

var book = {
    _year: 2004,
    edition: 1
};
Object.defineProperty(book,"year", {
    get: function(){
        return: this._year;    
    },
    set: function(newValue){
        if(newValue > 2004){
            this._year = newValue;
            this.edition += newValue - 2004 
        }
    }
});
var year = 2005;
alert(book.edition); //2

2. 생 성 대상
(1) 공장 모델

    function createPerson(name, age, job){
        var o = new Object()
        o.name = name
        o.age = age
        o.job = job
        o.sayName = function(){
            alert(this.name)
        }
        return o
    }
    var person = createPerson("Greag", 29, "Software Engineer")
    person.sayName()

이 createPerson () 을 호출 할 때마다 세 가지 속성 을 되 돌려 주 는 방법 이 있 습 니 다. 공장 모델 은 비슷 한 대상 의 문 제 를 여러 개 해 결 했 지만 대상 인식 문 제 를 해결 하지 못 해서 새로운 모델 이 나 타 났 습 니 다.
(2) 구조 함수 모드

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


    var person = new Person("Nic", 22, "Software Engineer")
    person.sayName()

구조 함 수 는 좋 지만 단점 이 없 는 것 이 아니 라 모든 방법 이 인 스 턴 스 에서 한 번 만들어 야 합 니 다. 하나의 함 수 를 정의 할 때마다 하나의 대상 을 예화 하 는 것 과 같 기 때문에 구조 함수 의 정 의 는 비슷 합 니 다.

 
    
   
   
   function Person(name,age,job){
        this.name = name;
        this.age = age;
        this.job = job;
        this.sayName =new Function( "alert(this.name)" ) //               }
var person1 = new Person("Greg", 22, "Doctor");
var person2 = new Person("Nic", 22, "Software Engineer");

这样就会导致不同的实例上的同名函数是不同的 alert( person1.sayName == person2.sayName) //false 创建两个完成相同任务的Function完全没有必要，于是又出现了原型模式

（3）原型模式

我们每创建一个函数都会有一个property(原型)属性，这个属性是一个指针，指向一个对象，而这个对象的用途就是包含可以由特定的类型的所有实例共享的属性和方法，也就是我们不必在构造函数中添加对象的信息，可以直接添加到原型对象上，

    //    
    function Person(){}
    Person.prototype.name = "Nic"
    Person.prototype.age = 22
    Person.prototype.sayName = function(){
        alert(this.name)
    }
    var person1 = new Person();
    var person2 = new  Person();
    alert(person1.sayName == person2.sayName)     //true

간결 한 원형 문법

    //       
    function Person(){}
    Person.prototype = {
        name:"Nic",
        age:22,
        sayName:function(){
            alert(this.name)
        }
    }

원형 모델 도 단점 이 없 는 것 이 아니다. 먼저 그 는 구조 함수 에 초기 화 된 매개 변 수 를 전달 하 는 부분 을 생략 했다. 그 결과 모든 인 스 턴 스 가 같은 상황 에서 똑 같은 속성 치 를 얻 었 다. 원형 모델 의 가장 큰 문 제 는 바로 공유 의 본질 로 인해 인용 속성 을 포함 하 는 데 있어 문제 가 매우 심각 하 다.예.

function Person(){};
Person.prototype = {
    constructor: Person,
    name: "nic",
    age: 23,
    friends: ["Court", "shelby"]  
}
var person1 = new Person();
var person2 = new Person();
person1.friends.push("Van")
alert(person1.friends)     //Court, shelby, Van
alert(person2.friends)     //Court, shelby, Van
alert(person1.friends === person2.friends) //true

우리 의 취 지 는 종종 그렇지 않다. 이것 도 우리 가 직접 원형 모델 을 사용 하 는 사람 을 거의 보지 못 하 는 이유 이다.
(4) 구조 함수 와 원형 모드 를 조합 하여 사용한다.
사용자 정의 형식 을 만 드 는 가장 흔 한 방식 은 구조 함수 모델 과 원형 모델 을 조합 하여 사용 하 는 것 입 니 다. 구조 함수 정의 인 스 턴 스 속성, 원형 모델 정의 방법 과 공유 속성, 예 입 니 다.

    //             
    function Person(name, age, job){
        this.name = name,
        this.age = age,
        this.job = job,
        this.friends = ["Court", "Shelby"]
    }
    Person.prototype = {
        constructor: Person,
        sayName: function(){
            alert(this.name)
        }
    }
    var person1 = new Person("Nic", 23, "Software Engineer")
    var person2 = new Person("Greg", 22, "Doctor")
    person1.friends.push("Van")
    alert(person1.friends)   //"Court", "Shelby", "Van"
    alert(person2.friends)   //"Court", "Shelby"
    alert(person1.friends === person2.friends)   //false
    alert(person1.sayName === person2.sayName)    //true

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

다양한 언어의 JSON

JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

Javascript 고급 프로 그래 밍 - 독서 노트 대상 (1)

좋은 웹페이지 즐겨찾기