JavaScript 고급 프로 그래 밍 (제3 판) 제6 장 대상 지향 프로 그래 밍

12998 단어 JavaScript
6.1 이해 대상
 
 
var person = new Object(); person.name = "Nicholas"; person.age = 29; person.job = "Software Engineer"; person.sayName = function(){ alert(this.name); }; person.sayName();
6.1.1 속성 유형
1. 데이터 속성
  • [Configurable]: delete 를 통 해 속성 을 삭제 할 수 있 는 지, 속성의 특성 을 수정 할 수 있 는 지, 아니면 속성 을 접근 기 속성 으로 변경 할 수 있 는 지 를 표시 합 니 다.
  • [[Enumerable]: for - in 순환 을 통 해 속성 을 되 돌 릴 수 있 는 지 를 나 타 냅 니 다.
  • [Writable]: 속성의 값 을 수정 할 수 있 는 지 를 표시 합 니 다.
  • [Value]: 이 속성 을 포함 하 는 데이터 값 입 니 다.속성 값 을 읽 을 때 이 위치 에서 읽 기;속성 을 쓸 때 새 값 을 이 위치 에 저장 합 니 다.기본 값 은 undefined
  • 2. 접근 기 속성
  • [Configureable]: delete 를 통 해 속성 을 삭제 할 수 있 는 지, 속성의 특성 을 수정 할 수 있 는 지, 또는 속성 을 데이터 속성 으로 변경 할 수 있 는 지 를 표시 합 니 다.
  • [[Enumerable]: for - in 순환 을 통 해 속성 을 되 돌 릴 수 있 는 지 를 나 타 냅 니 다.
  • [Get]: 속성 을 읽 을 때 호출 되 는 함수 입 니 다.기본 값 은 undefinded 입 니 다.
  • [Set]: 속성 을 쓰 는 것 은 호출 된 함수 입 니 다.기본 값 은 undefinded 입 니 다.

  • 6.1.2 여러 속성 정의
            var book = {};
    
            
    
            Object.defineProperties(book, {
    
                _year: {
    
                    value: 2004
    
                },
    
                
    
                edition: {
    
                    value: 1
    
                },
    
                
    
                year: {            
    
                    get: function(){
    
                        return this._year;
    
                    },
    
                    
    
                    set: function(newValue){
    
                        if (newValue > 2004) {
    
                            this._year = newValue;
    
                            this.edition += newValue - 2004;
    
                        }                  
    
                    }            
    
                }        
    
            });
    
               
    
            book.year = 2005;
    
            alert(book.edition);   //2

     
    6.1.3 읽 기 속성의 특성
            var book = {};
    
            
    
            Object.defineProperties(book, {
    
                _year: {
    
                    value: 2004
    
                },
    
                
    
                edition: {
    
                    value: 1
    
                },
    
                
    
                year: {            
    
                    get: function(){
    
                        return this._year;
    
                    },
    
                    
    
                    set: function(newValue){
    
                        if (newValue > 2004) {
    
                            this._year = newValue;
    
                            this.edition += newValue - 2004;
    
                        }                  
    
                    }            
    
                }        
    
            });
    
               
    
            var descriptor = Object.getOwnPropertyDescriptor(book, "_year");
    
            alert(descriptor.value);          //2004
    
            alert(descriptor.configurable);   //false
    
            alert(typeof descriptor.get);     //"undefined"
    
            
    
            var descriptor = Object.getOwnPropertyDescriptor(book, "year");
    
            alert(descriptor.value);          //undefined
    
            alert(descriptor.enumerable);     //false
    
            alert(typeof descriptor.get);     //"function"

     
    6.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 person1 = createPerson("Nicholas", 29, "Software Engineer");
    
            var person2 = createPerson("Greg", 27, "Doctor");
    
            
    
            person1.sayName();   //"Nicholas"
    
            person2.sayName();   //"Greg"

     
    6.2.2 구조 함수 모드
            function Person(name, age, job){
    
                this.name = name;
    
                this.age = age;
    
                this.job = job;
    
                this.sayName = function(){
    
                    alert(this.name);
    
                };    
    
            }
    
            
    
            var person1 = new Person("Nicholas", 29, "Software Engineer");
    
            var person2 = new Person("Greg", 27, "Doctor");
    
            
    
            person1.sayName();   //"Nicholas"
    
            person2.sayName();   //"Greg"
    
            
    
            alert(person1 instanceof Object);  //true
    
            alert(person1 instanceof Person);  //true
    
            alert(person2 instanceof Object);  //true
    
            alert(person2 instanceof Person);  //true
    
            
    
            alert(person1.constructor == Person);  //true
    
            alert(person2.constructor == Person);  //true
    
            
    
            alert(person1.sayName == person2.sayName);  //false    

     
    6.2.3 원형 모델
            function Person(){
    
            }
    
            
    
            Person.prototype.name = "Nicholas";
    
            Person.prototype.age = 29;
    
            Person.prototype.job = "Software Engineer";
    
            Person.prototype.sayName = function(){
    
                alert(this.name);
    
            };
    
            
    
            var person1 = new Person();
    
            person1.sayName();   //"Nicholas"
    
            
    
            var person2 = new Person();
    
            person2.sayName();   //"Nicholas"
    
          
    
            alert(person1.sayName == person2.sayName);  //true
    
            
    
            alert(Person.prototype.isPrototypeOf(person1));  //true
    
            alert(Person.prototype.isPrototypeOf(person2));  //true
    
            
    
            //only works if Object.getPrototypeOf() is available
    
            if (Object.getPrototypeOf){
    
                alert(Object.getPrototypeOf(person1) == Person.prototype);  //true
    
                alert(Object.getPrototypeOf(person1).name);  //"Nicholas"
    
            }

     
    1.       원형 을 이해 하 다
    언제든지 새 함 수 를 만 들 면 특정한 규칙 에 따라 이 함수 에 prototype 속성 을 만 듭 니 다.기본 적 인 상황 에서 모든 prototype 속성 은 자동 으로 constructor 속성 을 얻 습 니 다. 이 속성 은 prototype 속성 함 수 를 가리 키 는 지침 을 포함 합 니 다.
    2.       원형 과 in 연산 자
    in 연산 자 를 사용 하 는 두 가지 장소: 단독으로 사용 하거나 for - in 순환 중
    단독 사용: in 연산 자 는 대상 을 통 해 주어진 속성 에 접근 할 수 있 을 때 true 로 돌아 갑 니 다.
    3.       더 간단 한 원형 문법
    function Person(){}
    Person.prototype = {
               name: ‘Nicholas’,
               age: 29,
               sayName: function(){
                        alert(this.name);
               }
    }
    4.       원형 의 동태 성
    원형 을 다시 쓰 면 기 존 원형 과 이전에 존 재 했 던 대상 인 스 턴 스 간 의 관 계 를 차단 합 니 다. 비록 그들 이 인용 한 것 은 최초의 원형 이지 만.
    5.       원생 대상 의 원형
    네 이 티 브 대상 을 확장 할 수 있 는 방법
    String.prototype.startWith = function(){
             return this.indexOf(text) == 0;
    }
    var msg = ‘hello world’;
    alert(msg.startWith(‘hello’)); //output true
    6.       질문
    프로 토 타 입 에 있 는 모든 속성 이 많은 인 스 턴 스 에 의 해 공유 되 고 인용 유형 을 포함 하 는 속성 에 있어 서 그다지 낙관적 이지 않 습 니 다.
    6.3.1 원형 체인
    원형 체인 이 계승 을 실현 하 는 원리: 원형 을 이용 하여 하나의 인용 유형 으로 하여 금 다른 인용 유형의 속성 과 방법 을 계승 하 게 한다. 하나의 구조 함수, 원형 과 사례 의 관 계 를 돌 이 켜 보면 모든 구조 함수 에는 하나의 원형 대상 이 있 고 원형 대상 은 하나의 구조 함 수 를 가리 키 는 지침 을 포함 하 며 인 스 턴 스 는 원형 대상 을 가리 키 는 내부 지침 을 포함한다. 만약 에 우리 가 만약 에원형 대상 을 다른 유형의 실현 과 같 게 하면 결 과 는 어떻게 될 까? 분명 한 것 은 이때 의 원형 대상 은 다른 원형 을 가리 키 는 지침 을 포함 할 것 이다. 이에 따라 다른 원형 에 도 다른 구조 함 수 를 가리 키 는 지침 이 포함 되 어 있다. 만약 다른 원형 이 또 다른 유형의 인 스 턴 스 라면 상기 관 계 는 성립 된다. 이렇게 층 층 이 발전 하면 구성 된다.인 스 턴 스 와 원형 체인 이 있 습 니 다.

    좋은 웹페이지 즐겨찾기