JS 레 드 북 판독 의 고급 함수

1. 안전 한 유형 검 측 type: of, instanceof 에서 대상 이 원생 대상 인지 사용자 정의 대상 인지 검 측 합 니 다. 가끔 오류 가 발생 할 수 있 습 니 다. Object 원생 의 toString () 방법 으로 검 측 할 수 있 습 니 다.
(1) 원생 배열 검사

    function isArray(value) {
      return Object.prototype.toString.call(value)==='[object Array]'
    }

(2) 원생 함수 검출

    function isFunction(value) {
      return Object.prototype.toString.call(value)==='[object Function]'
    }

(3) 원생 정규 표현 식 검출

    function isRegExp(value) {
      return Object.prototype.toString.call(value)==='[object RegExp]'
    }

원리: Object 원생 의 toString 방법 을 호출 하면 [object Native Constructor Name] 형식의 문자열 을 되 돌려 줍 니 다.그리고 Array, Object, Function 등 내부 가 모두 [Class] 속성 입 니 다. 이 속성 은 Native Constructor Name 의 구체 적 인 이름 을 지정 합 니 다. 예 를 들 어 Object, Array, RegExp, Function 등 입 니 다.
네 이 티 브 JS 대상 인지 아 닌 지 를 판단 할 수 있 습 니 다.
2. 역할 영역 안전 한 구조 함수 주의: 구조 함 수 는 new 로 호출 된 함수 입 니 다.

    function Person(name,age,sex){
      this.name=name
      this.age=age
      this.sex=sex
    }

new 다음 에 새로 만 든 대상 입 니 다. this 는 이 새 대상 (새로운 인 스 턴 스) 을 말 합 니 다.

    let personA=new Person("a",'18','man')
    console.log(personA,window.name,window.age,window.sex) //{age:"18",name:"a",sex:"man"}

new 를 사용 하지 않 는 결 과 는 window 에서 Person 구조 함 수 를 호출 하 는 것 입 니 다. 그래서 Person 내부 의 this 는 window 를 말 합 니 다. name, age, sex 도 모두 window 속성 입 니 다.

    let personB=Person("b",'22','woman')
    console.log(personB,window.name,window.age,window.sex) //undefined "b" "22" "woman"

따라서 구조 함 수 를 호출 할 때 그 역할 영역 을 판단 해 야 한다.
해결 방법: this 대상 이 정확 한 유형의 인 스 턴 스 인지 확인 하고 그렇지 않 으 면 새로운 인 스 턴 스 를 만 들 고 되 돌려 줍 니 다.

    function Person(name,age,sex){
      // instanceof xxx   
      if(this instanceof Person){
        this.name=name
        this.age=age
        this.sex=sex
      }else{
        return new Person(name,age,sex)
      }
    } 

결함: 구조 함수 의 훔 치기 모드 xxx. call (this. xxx) 를 사용 하고 원형 체인 을 사용 하지 않 으 면 이 계승 을 파괴 할 수 있 습 니 다.

    function Father(age){
      if(this instanceof Father){
        this.age=age
      }else{
        return new Father(age)
      }
    }

    function Child(sex) {
      //  Child  Father     (this instanceof Father false)，
      //        Father  
      //           Child    
      Father.call(this,18)
      //this  Child
      //  Father    (this instanceof Father)，
      // Father  this.age this    Child 
      this.sex=sex
    }

    let childA=new Child('man')
    console.log(childA.age) //undefined

한 마디 로 Child 가 Father 의 속성 을 호출 할 때 새로 만 든 Father 인 스 턴 스 로 인해 this 는 Child 자체 의 this 가 아니다.
해결: 원형 체인 사용

    ...
    ...
    ...
    // Child     Father   
    Child.prototype=new Father()
    let childA=new Child('man')
    console.log(childA.age) //18

3. 타성 불 러 오기 (최적화 프로젝트) 는 if 문 구 를 매번 실행 하지 않 아 도 됩 니 다. 즉, 타성 불 러 오기 가 왜 입 니까?왜냐하면 if 문구 가 있 으 면 if 문구 가 없 는 것 보다 느 려 요.

    function  createFamily(number){
      if(number===1){
       //xxxx1
      }else{
        if(number===2){
          //xxxx2
        }else{
          //xxxx3
        }
      }
    }

첫 번 째 최적화:

    function  createFamily(number){
      if(number===1){
        createFamily=function () {
          //xxxx1
        }
      }else{
        if(number===2){
          createFamily=function () {
            //xxxx2
          }
        }else{
          createFamily=function () {
            //xxxx3
          }
        }
      }
    }

두 번 째 최적화:

    let createFamily=(function(number) {
      if(number===1){
        return function () {
          //xxxx1
        }
      }else{
        if(number===2){
          return function () {
            //xxxx2
          }
        }else{
          return function () {
            //xxxx3
          }
        }
      }
    //     number    
    })(number)

주의: 첫 번 째 판단 에 만 사용 되 며, 왔다갔다 판단 조건 에 적용 되 지 않 습 니 다!다음 호출 은 직접 판단 하지 않 고 저쪽으로 간다.이것 은 프로젝트 코드 최적화 에 사용 할 수 있다.
(끝)