JavaScript 디자인 모드 독서 노트 -----글자 크기 및 구조 함수, 함수

3678 단어
  • new 조작부호로 구조 함수를 호출할 때 함수 내부에 다음과 같은 변화가 발생한다.
  • 빈 대상을 만들고this 변수는 이 대상을 인용하며 이 함수의 원형을 계승한다.속성과 방법이this 인용 대상에 추가됨;새로 만든 대상은this에서 인용하고 마지막으로 은밀하게this로 되돌아오기;
    var Person = function (name) {
     //                
     var this = {} ;
     // this       
     this.name = name;
     this.say = function () {
       return "I'm" + this.name;
     }  
    //return this;
    };
    //     ,        Person   
    Person.prototype.say = function () {
     return "I'm" + this.name;
    }
    
  • new 조작부호를 사용하여 대상을 만들 때 구조 함수는 항상 대상을 되돌려줍니다.기본적으로this에서 인용한 대상을 되돌려줍니다. 비어 있습니다.
  • 수조를 검출하는 방법:
  • if ( typeof Array.isArray === "undefined" ) {
     Array.isArray = function (arg) {
     //  Object.prototype.toString() call()  ,        [object Array],    [Object Object]
       retrun Object.prototype.toString.call(arg) === "[object Array]";
       };
    }
    
  • 함수의 향상
  • function foo () {
      alert("global foo");
    }
    function bar () {
      alert("global bar");
    }
    function hoistMe() 
      console.log(typeof foo); // "function"
      console.log(typeof bar); //"undefined"
    
      foo(); // "global foo"
      bar(); // TypeError: bar is not a function
      //    ,  "foo"        
      function foo ()  {
        alert("local foo");
      }
      //     ,   "bar"   ,         
      var bar = function () {
        alert("local bar");
      };
    }
    hoistMe();
    
  • 비동기 이벤트 감청기
  • document.addEventListener("click",function(){alert("hello~")},false);
    
  • Immediate Function pattern(Immediate Function pattern)은 함수를 정의한 후 바로 실행할 수 있는 구문입니다.
  • (function () {
        alert("looooooook!");
    }());
    //           ,          
    //                ,                  
    
  • 실시간 함수의 반환값은 실시간 함수를 이용하여 대상의 생존 기간 내에 변하지 않는 속성을 포장할 수 있고 실시간 함수의 반환값은 속성 값이 된다.
  • var  o = {
     message: (function(){
        var who = "me",
            what = "call";
       return what+" "+who;
    }()),
    getMsg: function () {
     return this.message;
       }
    };
    o.getMsg(); //  "call me"
    o.message; //  "call me"
    
  • 실시간 함수의 초기화
  • ({...}).init();
    ({...}.init());
    //    init()              ,     init()    "return this"     ;
    
  • 메모리 모드 함수 myFunc가 속성 캐치를 만들었습니다. 캐치 속성은 하나의 대상(해시 대상)으로 함수에 전달된 param을 키로 사용하고 결과는 값입니다.
  • var myFunc = function () {
        if ( !myFunc.cache[param] ) {
          //    
          var result = {};
          myFunc.cache[param] = result; 
         }
        return myFunc.cache[param];
    }
    
  • 구성 객체
  • //before
    function addPerson (name,age,birth,address,gender,first,last){......}; 
    addPerson("begin","16",'123"," ","b","g");
    //after
    var conf = {
          name:"begin",
          first:"b",
          last::"g",
          gender:" "
    };
    addPerson(conf);
    

    장점: 많은 매개 변수와 순서를 기억할 필요가 없고 선택할 수 있는 매개 변수를 안전하게 무시할 수 있으며 읽기와 유지보수가 쉽고 매개 변수를 추가하고 삭제하기 쉽다.
  • call()와apply()의 차이http://www.jianshu.com/p/3a823ef9db97
  • Curry화//새 함수가 기존 함수를 바탕으로 하고 일부 매개 변수 목록을 추가할 때 깊이 있게 이해해야 한다.

  • 요약:
  • API 모드:
  • 리셋 모드: 함수를 매개 변수로 전달
  • 설정 대상: 함수를 제어하기 쉬운 매개 변수 수량
  • 반환 함수: 한 함수의 반환 값이 다른 함수일 때
  • Curry화: 새 함수가 기존 함수를 바탕으로 하고 일부 매개 변수 목록을 추가할 때
  • 초기화 모드
  • 즉시 함수: 정의된 즉시 함수
  • 즉시 대상 초기화: 익명 대상이 초기화 작업을 조직하여 즉시 호출할 수 있는 방법을 제공
  • 초기화 시 분기: 분기 코드가 초기화될 때 한 번만 검사할 수 있도록 도와줍니다
  • 성능 모드
  • 메모 모드: 계산된 값을 다시 계산하지 않도록 함수 속성을 사용합니다
  • 사용자 정의 모드: 새로운 주체중 쓰기 자체로 후속 호출 시 작업이 더욱 적게
  • 좋은 웹페이지 즐겨찾기