前端的常見面試題——基礎篇

question1：說說你對原型鏈的理解/prototype(原型)與_proto_(原型鏈)？

1. 原型prototype：

• JavaScript 規定，每一個構造函數都有一個prototype 屬性，指向另一個對象。注意這個prototype就是一個對象，這個對象的所有屬性和方法，都會被構造函數所擁有。
• 我們可以把那些不變的方法，直接定義在 prototype 對象上，這樣所有對象的實例就可以共享這些方法。

  function Star(uname, age) {
      this.uname = uname;
      this.age = age;
  }
  Star.prototype.sing = function() {
  	console.log('我會唱歌');
  }
  var ldh = new Star('劉德華', 18);
  var zxy = new Star('張學友', 19);
  ldh.sing();//我會唱歌
  zxy.sing();//我會唱歌
  

2. 原型鏈_proto_

• 對象都會有一個屬性 proto 指向構造函數的 prototype 原型對象，之所以我們對象可以使用構造函數 prototype 原型對象的屬性和方法，就是因為對象有 proto 原型的存在。
  __proto__對象原型和原型對象 prototype 是等價的
  __proto__對象原型的意義就在於為對象的查找機制提供一個方向，或者說一條路線，但是它是一個非標准屬性，因此實際開發中，不可以使用這個屬性，它只是內部指向原型對象 prototype
  [外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片保存下來直接上傳(img-l7UBNL8k-1595989934842)(../img/原型與原型對象.png)]

3. constructor構造函數 :
   對象原型（ proto）和構造函數（prototype）原型對象里面都有一個屬性 constructor 屬性 ，constructor 我們稱為構造函數，因為它指回構造函數本身。
   constructor 主要用於記錄該對象引用於哪個構造函數，它可以讓原型對象重新指向原來的構造函數。
   一般情況下，對象的方法都在構造函數的原型對象中設置。如果有多個對象的方法，我們可以給原型對象采取對象形式賦值，但是這樣就會覆蓋構造函數原型對象原來的內容，這樣修改后的原型對象 constructor 就不再指向當前構造函數了。此時，我們可以在修改后的原型對象中，添加一個 constructor 指向原來的構造函數。

question2: 說說你對閉包的理解？

1. 什么是閉包？ 閉包（closure）指有權訪問另一個函數作用域中變量的函數。簡單理解就是 ，一個作用域可以訪問另外一個函數內部的局部變量。
2. 閉包的作用：延伸變量的作用范圍。

    function fn() { // fn就是閉包函數
      var num = 10;
      function fun() {
          console.log(num);
    	}
       return fun;
    }
   var f = fn();
   f();
   

question3: this指向問題

• constructor中的this指向的是new出來的實例對象
• 自定義的方法,一般也指向的new出來的實例對象
• 綁定事件之后this指向的就是觸發事件的事件源
• 箭頭函數的this一層一層的往上走

question4: 說說數組有哪些方法？

1. push()
2. pop()
3. shift() 從數組中刪除第一個元素，並返回該元素的值。此方法更改數組的長度
4. unshift() 方法將一個或多個元素添加到數組的開頭，並返回該數組的新長度(該方法修改原有數組)。
5. concat() 方法用於合並兩個或多個數組。此方法不會更改現有數組，而是返回一個新數組
6. slice()[切割] 方法返回一個新的數組對象，這一對象是一個由 begin 和 end 決定的原數組的淺拷貝（包括 begin，不包括end）。原始數組不會被改變。
7. splice() 方法通過刪除或替換現有元素或者原地添加新的元素來修改數組,並以數組形式返回被修改的內容。此方法會改變原數組
8. find() 方法返回數組中滿足提供的測試函數的第一個元素的值。否則返回 undefined。
9. filter() 對數組的每項元素進行過濾得到新數組
10. map() 對每個元素單獨進行運算
11. reduce() 對數組的每個元素前后進行匯總

question5: 說說es6語法？

• let 只在所處的塊級有效 1.不存在變量提升 2.暫時性死區
• const 常量(值/內存地址不能變化的量)

2. 解構賦值

• 數組解構
  let [a, b, c] = [1, 2, 3];
• 對象解構

let person = { name: 'zhangsan', age: 20 }; 
 let { name, age } = person;

3. 箭頭函數

• 什么時候使用箭頭函數： 當把某一個函數作為參數傳遞到例外一個函數中時
• 箭頭函數中的this指向：向外層作用域中，一層層查找this，直到有this的定義

4. 剩余參數

• 剩余參數語法允許我們將一個不定數量的參數表示為一個數組，不定參數定義方式，這種方式很方便的去聲明不知道參數情況下的一個函數

  function sum (first, ...args) {
       console.log(first); // 10
       console.log(args); // [20, 30] 
   }
   sum(10, 20, 30)
  

5. String的擴展方法: 模板字符串(***)

• 模板字符串中可以解析變量

  let name = '張三'; 
  let sayHello = `hello,my name is ${name}  `; // hello, my name is zhangsan
  

• 模板字符串中可以換行
• 在模板字符串中可以調用函數