《JavaScript 디자인 모델》 제2장을 읽고 느낀 점

19025 단어
대상방향 프로그래밍
대상을 대상으로 프로그래밍하는 것은 당신의 요구를 하나의 대상으로 추상화하는 것이다.그리고 이 대상을 대상으로 그 특징(속성)과 동작(방법)을 분석한다.이 대상을 우리는 유형이라고 부른다.대상을 대상으로 프로그래밍하는 사상의 특징 중 하나는 바로 봉인이다.
1. 사유 속성, 사유 방법, 특권 방법, 대상 공유 속성, 대상 공유 방법, 구조기와 유형 정적 공유 속성, 유형 정적 공유 방법, 공유 속성, 공유 방법
var Book = function (id,name,price){
  //    
  var num = 1;
  //    
  function checkId(){};
  //    
  this.getName = function(){};
  this.getPrice = function(){};
  this.setName = function(){};
  this.setPrice = function(){};
  //      
  this.id=id;
  //      
  this.copy=function(){};
  //   
  this.setName(name);
  this.setPrice(price);
};
//       (      )
Book.isChinese = true;
//       (      )
Book.resetTime = function(){
  console.log('new Tiem')
};
Book.prototype = {
  //    
  isJSBook : false;
  display : function(){}
}
      
var b = new Book(11,22,33);
console.log(b.num);        //undefined
console.log(b.isJSBook);     //false
console.log(b.id);                    //11
console.log(b.isChinese);    //undefined
console.log(Book.isChinese);     //true
Book.resetTime();                         //new Tiem

 
2. 클로즈업 실현
패킷을 닫는 것은 다른 함수 역할 영역에 접근할 수 있는 변수입니다. 즉, 한 함수에 다른 함수를 만드는 것입니다.
새 키워드의 역할은 현재 대상의this에 대한 끊임없는 부여로 볼 수 있습니다.만약 실례화할 때 new를 쓰지 않으면 전역 작용 영역에서 실례화 함수를 집행한 것과 같다. 그러면 실례화에 문제가 생길 것이다
작은 프로그램에 window 대상이 없기 때문에 전역적으로 new가 없을 때 오류가 발생하지만 웹 페이지에서는 오류가 발생하지 않습니다.
New 쓰기를 잊는 방법은 다음과 같은 보안 모드를 사용하는 것입니다.
var Book = function (title, time, type){
//실행 중this가 현재 대상인지 판단 (설명이 new로 만들어진 경우)  // foo Foo   //function Foo(){}   //var foo = new Foo();   //console.log(foo instanceof Foo)//true
 
if (this instance of Book) {//여기 instance는this가 가리키는 대상이 Book을 가리키는 실례가 아니라this가 가리키는 실례가 Book을 가리키는 것이 아닙니다
    this.title = title;
    this.time = time;
    this.type = type;  
  }else{
    return new Book(title,time,type);
  }
}
3. 상속
new 이후의 변수는prototype이 없고 만 있습니다proto__속성, 즉 실례화 이후에prototype 원형이 없지만prototype은 실례화 이후의proto__라고 적었다.실례화된 변수의proto__중의 constructor는 실례화 전의 구조 함수와 같다.
그러나 인스턴스화 이후의 구조 함수는 다음과 같이 인쇄할 수 있습니다.
console.log(a.__proto__.constructor)
이렇게 해도 돼요.
console.log(a.constructor)
인쇄된 것은 모두 실례화되기 전의 구조 함수입니다. 변수에서 속성을 찾지 못하면 변수의 숨겨진 속성을 제거합니다proto__찾다
찾기는 별 차이가 없지만, 추가 방법의 작용역은 다르다
a.proto__.b, 그러면 이 b 방법은proto__에서 실행됩니다. this는 a. 을 가리킵니다.proto__역할 영역
a.b를 쓰면 이 b 방법은 a에서 실행되고this는 a의 작용역을 가리킨다
자바스크립트는 숫자, 문자열, 브리 값, null,undefined를 제외한 대상이 대상이기 때문에 수조는 대상이고 대상 간에 서로 값을 부여하는 것은 교체된 메모리 주소일 뿐이며 메모리 주소가 가리키는 값은 똑같고 서로 영향을 미친다.
자세한 내용은 이 JavaScript의 중간값 유형과 참조 유형의 차이점을 찍으십시오.
다음은 기생 조합식 계승 실례를 넣는다.
 1 function inheritObject(o){
 2   function F(){}
 3   F.prototype = o;
 4   return new F();
 5 }
 6 
 7 function inheritPrototype(subClass,superClass){
 8   var p = inheritObject(superClass.prototype);
 9   console.log(p)
10   console.log(superClass)
11   p.constructor = subClass;
12   subClass.prototype = p
13 }
14 
15 function SuperClass(name){
16   this.name = name;
17   this.colors = ["red","blue","green"];
18 }
19 SuperClass.prototype.getName = function(){
20   console.log(this.name)
21 }
22 function SubClass(name,time){
23   SuperClass.call(this,name)
24   this.time = time;
25 }
26 
27 
28 inheritPrototype(SubClass,SuperClass);
29 SubClass.prototype.getTime = function(){
30   console.log(this.time)
31 }
32 var instance1 = new SubClass("js book",2014)
33 var instance2 = new SubClass("css book",2013)
34 
35 instance1.colors.push("black")
36 console.log(instance1.colors)
37 console.log(instance2.colors)
38 instance2.getName();
39 instance2.getTime();

4. 다상속
js의 for in 및 in 사용법
for in 사용법은 한 대상의 속성이나 방법을 훑어볼 수 있으며, 그룹을 훑어보는 것처럼 간단합니다.
js에서arguments 사용법
arguments는 인삼 수량이 확실하지 않은 함수를 두루 훑어볼 수 있으며, 인삼을 쓰지 않아도 인삼의 값과 수량을 얻을 수 있다.이 대상은callee 방법을 봉하여 귀속을 실현할 수 있습니다.
 
 1 Object.prototype.mix = function () {
 2   var i = 0,
 3     len = arguments.length
 4   var arg;
 5   for (; i < len; i++) {
 6     arg = arguments[i];
 7     for (var p in arg) {
 8       this[p] = arg[p]
 9     }
10   }
11 }
12 
13 var book1 = {
14   name: "javascript    ",
15   alike: ['css', 'html', "javascript"]
16 }
17 var book2 = {
18   color: "blue"
19 }
20 var otherBook1 = {
21   aa: "11"
22 }
23 var otherBook2 = {
24   bb:"22"
25 }
26 otherBook1.mix(book1, book2)
27 otherBook1.alike.push("ajax")
28 console.log(otherBook1)
29 
30 otherBook2.mix(book1, book2)
31 console.log(otherBook2)

 
여기에서 인용 유형 속성이 공용인지 볼 수 있습니다.
얕은 복제 중의 복제 대상의 방법 대상은 실질적으로 일종의 지향 인용이기 때문에 우리는 깊은 복제에서 이 대상의 인용 유형 속성을 값 형식으로 세분화하여 목표 대상에 복제해야 한다.
이것은 이 장의 마지막 문제인데, 어떻게 심도 있는 복제를 실현할 것인가.
그리고 나는 이전에 쓴 단계승이 어떻게 실현되었는지 되돌아봤다. 인용 유형 속성이 공용되지 않는(이전에는 유형 속성이 공용되지 않는지 자세히 보지 못했다) 그리고 원래 구조 함수가 계승하는 곳에서 유형 속성이 공용되지 않는 방법을 응용한 것을 발견했다.
콜로 함수 작용을 바꾸는 환경을 사용하면 실현할 수 있다.(이것은 이전에 다른 함수를 호출할 때마다 콜을 사용했다는 것을 생각하게 한다. 이제야 콜이 함수 작용 환경을 바꾸는 목적은this의 지향을 바꾸는 것이 아니라 응용 유형 속성이 공용되지 않고 이 방법을 복제하는 역할을 실현할 수 있다는 것을 알게 되었다)
그러나 여기에는 함수를 구성하는 방법이 쓰이지 않았다.
 1 Object.prototype.mix = function () {
 2   var i = 0,
 3     len = arguments.length
 4   var arg;
 5   for (; i < len; i++) {
 6     arg = arguments[i];
 7     for (var p in arg) {
 8       if (typeof arg[p] == 'object') {
 9         var str = JSON.stringify(arg[p])
10         this[p] = JSON.parse(str);
11       } else {
12         this[p] = arg[p]
13       }
14       console.log(typeof arg[p])
15 
16     }
17   }
18 }
19 
20 var book1 = {
21   name: "javascript    ",
22   alike: ['css', 'html', "javascript"]
23 }
24 var book2 = {
25   color: "blue"
26 }
27 var otherBook1 = {
28   aa: "11"
29 }
30 var otherBook2 = {
31   bb: "22"
32 }
33 otherBook1.mix(book1, book2)
34 otherBook1.alike.push("ajax")
35 console.log(otherBook1)
36 
37 otherBook2.mix(book1, book2)
38 console.log(otherBook2)

 
이렇게 하면 다중 계승의 깊은 복제를 실현할 수 있다
5. 다태
이곳의 다태는 같은 방법의 다중 호출 방식이고 실질은 위의arguments의 용법이며 전참의 수량에 따라 호출하는 방법이 다르다.
 
본인은 학습 단계에 있으니 여러분의 지적을 잘못 환영합니다.
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

좋은 웹페이지 즐겨찾기