질문과 대답 (A)의 전면 (RPM)을 마무리

이 회사는 곧 모집하기 시작 각각의 가을, 최근의 인터뷰에서 모든 종류의 것들을 준비 간단하게 찾을 얼굴 질문 깔끔한 밖으로 공유를, 얼굴 질문의 대부분은 표준 대답하지, 내가 준 대답은 정보 목적으로 만입니다 코멘트 영역에 더 나은 답변을 환영있는 경우.

1 부 필기 코드

라이브 인터뷰 필기 코드는 능력에 기반 데이터 구조와 알고리즘을 검토, 지금 면접 질문의 아주 일반적인 유형입니다.

중량을 달성하기 위해 1 개 어레이

• 기본 배열 중복

Array.prototype.unique = function(){
    var result = [];
    this.forEach(function(v){
        if(result.indexOf(v) < 0){
            result.push(v);
        }
    });
    return result;
}

• 시간 공간의 방법이다 무거운에 해시 테이블을 사용하여

Array.prototype.unique = function(){
    var result = [],hash = {};
    this.forEach(function(v){
        if(!hash[v]){
            hash[v] = true;
            result.push(v);
        }
    });
    return result;
}

개체 속성 인덱스에 전송할 수 있기 때문에 상기 방법은, 중량에 대한 결과는 [ '1', '2', 3, 1,2] [2,3] 배열 버그를 갖고 도착 [ '1'] 및 도착 [1] [1]의 값을 얻을 도착하므로 약간의 변화를 필요로된다 :

Array.prototype.unique = function(){
    var result = [],hash = {};
    this.forEach(function(v){
        var type = typeof(v);  //获取元素类型
        hash[v] || (hash[v] = new Array());
        if(hash[v].indexOf(type) < 0){
            hash[v].push(type);  //存储类型
            result.push(v);
        }
    });
    return result;
}

• 첫 번째 순서 중복 제거 후

Array.prototype.unique = function(){
    var result = [this[0]];
    this.sort();
    this.forEach(function(v){
        v != result[result.length - 1] && result.push(v); //仅与result最后一个元素比较
    });
}

• 많이 사용에 ES6 설정

    //ES6环境下
    Array.prototype.unique = function(){
         return [...new Set(this)];
    }

실현이 빠른 정렬

(가능한 멀리 JS 배열 방법없이) 하나의 방법 :

function quickSort(arr){
    qSort(arr,0,arr.length - 1);
}
function qSort(arr,low,high){
    if(low < high){
        var partKey = partition(arr,low,high);
        qSort(arr,low, partKey - 1);
        qSort(arr,partKey + 1,high);
    }
}
function partition(arr,low,high){
    var key = arr[low];  //使用第一个元素作为分类依据
    while(low < high){
        while(low < high && arr[high] >= arr[key])
            high--;
        arr[low] = arr[high];
        while(low < high && arr[low] <= arr[key])
            low++;
        arr[high] = arr[low];
    }
    arr[low] = key;
    return low;
}

방법 2 (JS하여 배열 방법) :

function quickSort(arr){
   if(arr.length <= 1) return arr;
   var index = Math.floor(arr.length/2);
   var key = arr.splice(index,1)[0];
   var left = [],right = [];
   arr.forEach(function(v){
       v <= key ? left.push(v) : right.push(v);
   });
   return quickSort(left).concat([key],quickSort(right));
}

빠른 정렬의 평균 시간 복잡도는 O (nlogn)는 최악의 경우는, 시간 복잡도를 n 제곱, 다른 빠른 정렬이 불안정 주문하는 것도주의해야합니다.

2 부 자바 스크립트 관련

1 개 자바 스크립트 기본 데이터 유형

자바 스크립트 데이터 유형은 기본 유형 및 참조 유형을 포함, 기본 유형 다섯 있습니다 :

  Number（数值） String（字符串） Boolean（布尔） Null（空） Undefined（未定义）

참조 유형이 있습니다 :

 Object（对象）

함으로써 대해서 typeof (x)는 변수 x "숫자", "문자열"데이터 유형 돌아갈 수 "부울", "미등록", "객체" 것을 유의 여기서는위한 대해서 typeof 연산자 널 반환형 인 개체 .

"프로그래밍 자바 스크립트 고급"
이 실제로 자바 스크립트의 초기 구현의 실수, ECMAScript를 나중에 다음과 같습니다. 지금은이 모순을 설명 Null 개체 자리가 될 것으로 간주. 그러나 기술적으로 여전히 원래의 값입니다.

자바 스크립트 (2)는 범위 체인에 대해 이야기하기

자바 스크립트 코드 (글로벌 코드 또는 함수)를 실행하는 경우, 자바 스크립트 엔진은 페이지가로드 된 후 제 글로벌 범위를 만들 것 같은 실행 컨텍스트 (실행 상황)로 알려진 범위를 생성하는 생성하고, 각각 수행합니다 기능은 따라서 범위 체인을 형성하는 대응 영역을 생성한다. 각 범주는 체인 헤드에 대응하는 범위 체인 글로벌 범위 체인의 끝이 전류 범위의 함수이다 갖는다.

범위 체인의 역할은 경우에 자바 스크립트를 찾아야이 인자라는 인수 및 모든 로컬 변수 함수가 현재 범위에 추가 될 것이다 함수 (실행되지 않음) 생성 식별자를 확인하는 데 사용되는 (프로세스가 다변량 분석라고도 함) 변수 X, 그것은 범위 체인에서 체인의 일단은 X 속성이있는 경우는 범위 체인이 아래로보고 계속 찾을 수없는 경우, 찾을 수있는 현재 범위 인 것, 찾아 전역 체인 인 체인의 헤드는 다음이 변수 x가 코드 범위 사슬에 존재하고, 기준 오차 (ReferenceError가) 예외가 발생하지 않는 것으로 간주하고, 변수를 찾아야 아직.

3 자바 스크립트의 프로토 타입 체인을 이해하는 방법

각 자바 스크립트 객체가 가지고 prototype우리가 프로토 타입을 호출, 속성을, 그리고 프로토 타입도 값의 목적은, 또한 그렇게 함께 프로토 타입 체인, 체인 헤드 프로토 타입 체인은 객체를 연결 자신의 프로토 타입을 가지고, 그것을 프로토 타입은, 오히려 특별한 null입니다.

객체 상속 속성 기능 프로토 타입 (prototype 속성)에 대한 작업 프로토 타입 체인이 함수는 인스턴스 생성자를 생성하는데 사용되는 오브젝트 인 함수의 프로토 타입의 속성은 원형으로 모든 객체 인스턴스에 할당 할 우리는 새로운 배열을 만들 같은 배열 방법은 상속 원형 배열로 시작합니다.

속성은 개체에 액세스하는 경우, 먼저 객체 자체가 수익을 찾을 위치, 발견되지 않는 경우는, (실제로 루트까지 프로토 타입 체인을 조회 할를 찾을 수없는 경우)의 프로토 타입 객체의 속성을 찾기 위해 계속 한은이 적용되지 않기 때문에, 프로토 타입 객체의 속성은 전체 프로토 타입 체인이 반환 정의되지 않은 발견되면, 모든 인스턴스를 찾을 수 있습니다;

사전에 4 개 자바 스크립트 변수 선언

"확실한 가이드 자바 스크립트"이런 식으로 설명 : 이미 자바 스크립트 변수를 문 앞에, 자바 스크립트는이 기능을 비공식적으로한다 声明提前"이다, (리프팅) 즉, 자바 스크립트 함수가 선언 된 모든 변수를 (그러나 할당을 포함하지 않음) 함수 상단 사전 ".

관점에서 예 :

var scope = "global";
function myFunc(){
    console.log(scope); 
    var scope = "local";
}

콘솔이 범위 MYFUNC이 기능은 로컬 변수 범위는 함수의 상단에 미리 선언되어 있기 때문에, "글로벌"하지만, "정의"가 아니라 인쇄이 시간 만 범위 기술서, 지정되지 않은, 따라서 출력 정의되지 않은. 사실, 위의 코드를 다음과 같은 효과 :

var scope = "global";
function myFunc(){
    var scope;
    console.log(scope);
    scope = "local";
}

5 어떻게 자바 스크립트 클로저를 이해하고 적용

문학에 매우 추상적 인 개념의 폐쇄 특정 정의에 대해서는, 폐쇄 다른 함수의 지역 변수를 갈 수있는 문법 메커니즘의 함수라고 생각합니다.

예를 들면 :

function outFunc(){
    var name = "Vicfeel";
    function inFunc(){
        console.log(name);
    }
    return inFunc;
}
inFunc(); //控制台显示"Vicfeel"

이것은 당신이 여전히 기능 inFunc 지역 변수의 이름으로 outFunc에 액세스 할 수 있습니다, 우리가 볼 수있는 예이다.

폐쇄 응용 예는, 클로저의 특성을 이용하여 개인 속성 시뮬레이션은 단지 방법 sayAge에서 로컬 변수를 액세스 할 수 있지만, 또한 클래스의 개인 속성을 가능하게 외부 이름 액세스.

    function User(){
        this.name = "Vicfeel";  //共有属性
        var age = 23;    //私有属性
        this.sayAge:function(){
            console.log("my age is " + age); 
        }
    }
    var user = new User();
    console.log(user.name); //"Vicfeel"
    console.log(user.age);  //"undefined"
    user.sayAge();   //"my age is 23"

더 클로저를 보려면, 우리는 추천 학습 자바 스크립트 클로저 (클로저) - 루안 이풍 웹 로그를 .

자연 6 새로운 건물 객체

    function User(){
        this.name = "Vicfeel";
        this.age = 23;
    }
    
    var user = new User();

새로운 운영자, 사실, 사용자의 생성자에서 다음 작업을 완료 :

• 개체가 개체의 유형, 새로운 객체를 생성;
• 내부 객체의이 새로운 세트 및 프로토 타입 속성 생성자의 접근성 세트 (생성자 prototype.construtor는 지적을 의미)를;
• 생성자가 실행된다;
• 새로 생성 된 오브젝트를 돌려줍니다.

    function User(){
        //this = {};  
        //this.constructor = User；
        this.name = "Vicfeel";
        this.age = 23;
        //return this;
    }
    
    var user = new User();

수동으로 변수를 반환하는 경우 변수는 객체가 돌려 주어집니다 객체 인 경우는 유효하지 않은 원시적 형태 인 경우 기본 생성자 경우 새로 생성 된 객체가 반환됩니다.

7 자바 스크립트 프록시

우리는 시간의 많은 요소에 이벤트를 추가해야 할 경우, 이벤트가 상위 노드에 추가하여 이벤트 핸들러를 트리거하기 위해 부모 노드에 위탁 할 수있다.

예를 들어, 우리는 역동적 인 UL 리튬에 번호를 추가 할 필요가 리를 통과 할 필요는 한번의 클릭 이벤트를 추가

    <ul id='list'></ul>

    var count = 100;
    var ulList = document.getElementById("list");
    //动态构建节点
    for(var i = count;i--;){
        var liDom = document.createElement('li');
        ulList.appendChild(liDom);
    }
    //绑定点击事件
    var liNode = ulList.getElementByTagName("li");
    for(var i=0, l = liNodes.length; i < l; i++){
        liNode[i].onClick = function(){
            //li点击事件
        }
    }   

우리 모두가 알다시피, DOM 작업은 매우 소비 성능이다. 그래서 단순히 이벤트 바인딩 성능 살인자를 반복. 이벤트 브로커 핵심 아이디어는 가능한 한 거의만큼 가능한 이벤트를 모니터에 구속된다. 그것을 어떻게? 대답이 이벤트 메커니즘을 사용하는 버블 링 이벤트 (이벤트 버블) 바인딩 부모 UL은 다음하여 이벤트 핸들러가 결합 수를 줄이고, 노드가 트리거 event.target 이벤트에 의해 판단 될 수있다.

    var count = 100;
    var ulList = document.getElementById("list");
    //动态构建节点
    for(var i = count;i--;){
        var liDom = document.createElement('li');
        ulList.appendChild(liDom);
    }
    //绑定点击事件
    var liNode = ulList.getElementByTagName("li");
    liNode.onClick = function(e){
        if(e.target && e.target.nodeName.toUpperCase == "LI") {
            // li点击事件
        }
    }

새로운 내용을 발견하는 것은 지속적으로 업데이트 될 것입니다 ...

보웬 저자 : vicfeel
보웬 자료 : http://www.cnblogs.com/vicfeel
이 문서는 저자에 속하고 공원 전체를 블로그, 다시 인쇄에 오신 것을 환영합니다,하지만 유지하고 원래 링크를 제공해야한다이 섹션에서 선언 감사합니다!
이 기사를 읽는다면, 당신이 "추천"내 블로그를 클릭하면, 도움이 느낌!