JS面試寶典

1、對象的複製、深拷貝和淺拷貝。

js 數據類型8種（Number、String、Boolean、Null、undefined、object、symbol、bigInt）
symbol=本質是唯一標識符，可用作對象的唯一屬性
object = （Object、Array、Date、Function、RegExp等）

存儲方式：
基本類型：基本類型值在內存中佔用固定的內存中，保存在“棧內存”中，閉包變量除外。
引用類型：值是對象，保存在“堆內存”中。

淺拷貝

① 數組的slice和concat 方法。

var a = [ 1, 3, 5, { x: 1 } ];
var b = Array.prototype.slice.call(a);
b[0] = 2;
console.log(a); // [ 1, 3, 5, { x: 1 } ];
console.log(b); // [ 2, 3, 5, { x: 1 } ];

從輸出結果可以看出，淺拷貝後，數組a[0]並不會隨着b[0]改變而改變，說明a和b在棧內存中引用地址並不相同。

var a = [ 1, 3, 5, { x: 1 } ];
var b = Array.prototype.slice.call(a);
b[3].x = 2;
console.log(a); // [ 1, 3, 5, { x: 2 } ];
console.log(b); // [ 1, 3, 5, { x: 2 } ];

② …擴展運算符
對於值是對象的屬性無法完全拷貝成2個不同對象

③ for in

function shallowClone(copyObj) {
  var obj = {};
  for ( var i in copyObj) {
    obj[i] = copyObj[i];
  }
  return obj;
}

深拷貝

① JSON.parse(JSON.strinify() )
弊端比如不能處理函數等
1.拷貝的對象的值中如果有函數,undefined,symbol則經過JSON.stringify()序列化後的JSON字符串中這個鍵值對會消失
2.無法拷貝不可枚舉的屬性，無法拷貝對象的原型鏈
3.拷貝Date引用類型會變成字符串
4.拷貝RegExp引用類型會變成空對象
5.對象中含有NaN、Infinity和-Infinity，則序列化的結果會變成null
6.無法拷貝對象的循環應用(即obj[key] = obj)
總結： 它會拋棄對象的constructor，深拷貝之後，不管這個對象原來的構造函數是什麼，在深拷貝之後都會變成Object；這種方法能正確處理的對象只有 Number, String, Boolean, Array, 扁平對象，也就是說，只有可以轉成JSON格式的對象纔可以這樣用，像function沒辦法轉成JSON；

② 函數

③第三方插件（深拷貝庫）
lodash
jquery 提供一個$.extend可以用來做深拷貝 語法：$.extend([deep], target, object1[, objectN] )
**deep：**表示是否深拷貝 默認爲false 爲true爲深拷貝，爲false，則爲淺拷貝
target: Object類型 目標對象，其他對象的成員屬性將被附加到該對象上。
object1 objectN: 可選 Object類型 第一個以及第N個被合併的對象。

var $ = require('jquery');
var obj1 = {
   a: 1,
   b: {
     f: {
       g: 1
     }
   },
   c: [1, 2, 3]
};
var obj2 = $.extend(true, {}, obj1);
console.log(obj1.b.f === obj2.b.f);  // false

2、字符串和數組常用的函數，請舉例。

Array（ splice=指定位置增刪元素、slice=截取元素、join=元素連成字符串、
push=末尾追加元素、concat=數組合並、indexOf=查找指定元素的索引、
includes=檢查指定元素是否存在返回布爾（能檢測NaNcy）
String ( split=拆分爲數組、substr=截取指定位置的元素、indexOf=檢查是否包含元素)

3、寫一個方法獲取URL中的參數轉爲對象

String.prototype.getURLParames = function () {
  let reg = /([^&?=]+)=([^&?=]+)/g, obj = {};
  this.replace(reg, (...arg) => {
    obj[arg[1]] = arg[2]
  });
  return obj;
}

4、Vue 中組件的通信方式

① props/$emit

描述：父組件通過綁定屬性來向子組件傳遞數據，子組件通過props來接收數據。 子組件通過$emit事件調用父組件的方法來傳遞數據給父組件。

② provide / inject

③ $parent / $children

this.$parent.parentMsg 子組件通過該方式訪問父組件的實例。 this.$children[0].childMsg 父組件訪問子組件

④Vuex

5、遍歷常用的方法，那種效率最高？