フロントエンドの面接問題と答え-JS編
2931 ワード
この文章は最も完全な先端の面接問題ではありません(最も完全ではありませんて、もっと完全です)、ただ自分の面接の過程の中で出会ったいくつかの難題、見落としやすい問題に対して1つの簡単なノートをして、便利な後に面接の必要な小さい仲間達が参考にして、後続の内容は不定の時に更新して、間違いがあるところはみんなが指摘することを惜しまないことを望みます.
1、JS遅延ロードの方式はどれらがありますか? deferとasync 動的作成DOM方式(scriptの作成、DOMに挿入、ロード完了後callBack) オンデマンド非同期ロードjs 2、フロントエンドのドメイン間解決方案の詳細
3、浅いコピーと深いコピーを実現する方法浅いコピー: 直接通過=賦値 objオブジェクトに複数の階層がある場合、Objectを通過することができる.assign() 深いコピー 簡単にJSONを通ります.parse(JSON.stringify(data)) はlodashを通過する.js objオブジェクトが1レベルのみの場合、Objectを使用することができる.assign(); 再帰 Objectを通過する.create()メソッド は$を通過する.extend()メソッド
4、AMD、CMD、CommonJS間の区別CommonJS:同期ロード.clockを待たなければなりません.jsロードが完了してからstart()を呼び出すことができます.
AMD(require.js):非同期ロードモジュール=>依存プリアンブル、事前実行.依存を定義し、ロードが完了したらコールバック関数で実行します.
CMD(sea.js):非同期ロードモジュール=>依存が近く、実行が遅延します.
5、jsでnewオペレータを使って具体的に何をしましたか?
空のオブジェクトobjが作成されました.
空のオブジェクトobjの_proto__属性は構造関数Baseのprototype属性を指す.
コンストラクション関数を実行し、Baseのthisをobjに向けます.フロントエンド面接問題と答え-ブラウザ編 フロントエンド面接問題および回答-HTML編 フロントエンド面接問題と答え-CSS編 フロントエンド面接問題および回答-パフォーマンス最適化編
1、JS遅延ロードの方式はどれらがありますか?
3、浅いコピーと深いコピーを実現する方法
let data = {n: 1};
let cloneData = data;
cloneData.n = 2;
console.log(data.n) // 2
let data = {name: {firstName: 'lsh'}};
let cloneData = Object.assign({}, data);
cloneData.name.firstName = 'lx';
console.log(data.name.firstName) // lx
let cloneData = lodash.cloneDeep(data);
let data = {name: 'lsh'};
let cloneData = Object.assign({}, data);
cloneData.name = 'lx';
console.log(data.name); // lsh
function cloneDeep(data) {
if (!data || typeof data != "object") {
return data;
}
let obj = data.constructor === Array ? [] : {};
for (let i in data) {
obj[i] = typeof data[i] === 'object' ? cloneDeep(data[i]) : data[i]
}
return obj;
}
let data = {n: 1};
let cloneData = Object.create(data);
console.log(cloneData); // {}
console.log(cloneData.n); // 1
console.log(cloneData.__proto__); // {n: 1}
let data = {t: 1};
let cloneData = $.extend(true, {}, data, {t: 2});
cloneData.t = 3;
console.log(data.t) // 1
4、AMD、CMD、CommonJS間の区別CommonJS:同期ロード.clockを待たなければなりません.jsロードが完了してからstart()を呼び出すことができます.
const clock = reqiure('clock');
clock.start();
AMD(require.js):非同期ロードモジュール=>依存プリアンブル、事前実行.依存を定義し、ロードが完了したらコールバック関数で実行します.
require(['clock', 'lodash'], function(clock, lodash)) {
clock.start();
lodash.uniq();
}
CMD(sea.js):非同期ロードモジュール=>依存が近く、実行が遅延します.
define(function(reqiure, exports, module) {
var clock = require('clock');
clock.start();
var lodash = require('lodash');
lodash.uniq([]);
})
5、jsでnewオペレータを使って具体的に何をしましたか?
let obj = new Base();
空のオブジェクトobjが作成されました.
let obj = {};
空のオブジェクトobjの_proto__属性は構造関数Baseのprototype属性を指す.
obj.__proto__ = Base.prototype;
コンストラクション関数を実行し、Baseのthisをobjに向けます.
Base.call(obj);