フロントエンドの面接問題と答え-JS編


この文章は最も完全な先端の面接問題ではありません(最も完全ではありませんて、もっと完全です)、ただ自分の面接の過程の中で出会ったいくつかの難題、見落としやすい問題に対して1つの簡単なノートをして、便利な後に面接の必要な小さい仲間達が参考にして、後続の内容は不定の時に更新して、間違いがあるところはみんなが指摘することを惜しまないことを望みます.
1、JS遅延ロードの方式はどれらがありますか?
  • deferとasync
  • 動的作成DOM方式(scriptの作成、DOMに挿入、ロード完了後callBack)
  • オンデマンド非同期ロードjs
  • 2、フロントエンドのドメイン間解決方案の詳細
    3、浅いコピーと深いコピーを実現する方法
  • 浅いコピー:
  • 直接通過=賦値
  • let data = {n: 1};
    let cloneData = data;
    cloneData.n = 2;
    console.log(data.n) // 2
  • objオブジェクトに複数の階層がある場合、Objectを通過することができる.assign()
  • let data = {name: {firstName: 'lsh'}};
    let cloneData = Object.assign({}, data);
    cloneData.name.firstName = 'lx';
    console.log(data.name.firstName) // lx
  • 深いコピー
  • 簡単にJSONを通ります.parse(JSON.stringify(data))
  • はlodashを通過する.js
  • let cloneData = lodash.cloneDeep(data);
  • objオブジェクトが1レベルのみの場合、Objectを使用することができる.assign();
  • 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;
    }
  • Objectを通過する.create()メソッド
  • let data = {n: 1};
    let cloneData = Object.create(data);
    console.log(cloneData); // {}
    console.log(cloneData.n); // 1
    console.log(cloneData.__proto__); // {n: 1}
  • は$を通過する.extend()メソッド
  • 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);
  • フロントエンド面接問題と答え-ブラウザ編
  • フロントエンド面接問題および回答-HTML編
  • フロントエンド面接問題と答え-CSS編
  • フロントエンド面接問題および回答-パフォーマンス最適化編