web 前端工程師在面試時(shí),常常會(huì)被要去現(xiàn)場(chǎng)手寫(xiě)/機(jī)寫(xiě)代碼边酒。涉及的內(nèi)容包括常用的排序算法狸窘、查找算法朦前;JavaScript 語(yǔ)言中常用的幾種編程技巧,例如函數(shù)防抖春哨、節(jié)流恩伺、深拷貝、淺拷貝等凰荚。
數(shù)組與對(duì)象的深拷貝
深拷貝與淺拷貝的區(qū)別在于復(fù)制成員的層數(shù),淺拷貝是對(duì)輸入數(shù)組/對(duì)象的簡(jiǎn)單遍歷褒脯,而沒(méi)有考慮到輸入的數(shù)組/對(duì)象成員的類(lèi)型便瑟,當(dāng)它是對(duì)象或數(shù)組時(shí),單層的便利可以無(wú)法復(fù)制深層的組成成員番川,因此需要進(jìn)行深拷貝到涂,知道遍歷的成員再無(wú)子成員,類(lèi)似于二叉樹(shù)的遍歷到葉子節(jié)點(diǎn)颁督。
數(shù)組
// a array deepCopy demo
var res = [];
function deepCopy(arr) {
arr.forEach( ele => {
if(Array.isArray(ele)) {
deepCopy(ele);
}else {
res.push(ele);
}
});
return res;
}
var demoArr = [1,2,3,[3,4,5,[5,6,7]],9];
console.log(deepCopy(demoArr));
// [1, 2, 3, 3, 4, 5, 5, 6, 7, 9]
簡(jiǎn)單的遞歸算法践啄,判斷當(dāng)前子節(jié)點(diǎn)是不是數(shù)組,如果是數(shù)組調(diào)用自身沉御,對(duì)子節(jié)點(diǎn)再次進(jìn)行遍歷屿讽;如果不是,直接存入結(jié)果數(shù)組res
中伐谈。
類(lèi)似的還有對(duì)一個(gè)對(duì)象的深拷貝:
// a object deepCopy demo
var res = {};
function objDeepCopy (obj) {
for(var ele in obj ) {
if(typeof ele === 'object') objDeepCopy(ele);
else {
res[ele] = obj[ele];
}
}
return res;
}
var demoObj = {
name: 'fejavu',
age: 23,
hobby: {
hobby1: 'book',
hobby2: 'movie'
}
};
console.log(objDeepCopy(demoObj));
/*
[object Object] {
age: 23,
hobby: [object Object] {
hobby1: "book",
hobby2: "movie"
},
name: "fejavu"
}
*/
判斷子節(jié)點(diǎn)是不是對(duì)象烂完,是則調(diào)用自身進(jìn)行深層遍歷,否則直接存入結(jié)果對(duì)象中衩婚。
JavaScript 有許多奇技淫巧窜护,或者說(shuō)是語(yǔ)言本身的語(yǔ)法糖效斑。在日常的對(duì) JSON 數(shù)據(jù)的處理中非春,就涉及到類(lèi)似把數(shù)組/對(duì)象拍平(深拷貝),因此深拷貝可以說(shuō)是已經(jīng)集成在語(yǔ)言的常用函數(shù)本身:
var demoObj = {
name: 'fejavu',
age: 23,
hobby: {
hobby1: 'book',
hobby2: 'movie'
}
};
var demoArr = [1,2,3,[3,4,5,[5,6,7]],9];
console.log(JSON.parse(JSON.stringify(demoObj)));
console.log(JSON.parse(JSON.stringify(demoArr)));
實(shí)現(xiàn)一個(gè)instanceOf
函數(shù)
主要思路是檢驗(yàn)需校驗(yàn)的原型是否在實(shí)例的原型鏈上缓屠,如果是則返回true
奇昙,否則返回false
。
function instanceOf(instan, proto) {
let _instanProto = instan.__proto__;
if(_instanProto && _instanProto === proto.prototype) {
return true;
}else {
return instanceOf(_instanProto, proto);
}
return false;
}
let arr = 'new Array()';
console.log(instanceOf(arr, Object)); // true