フロントエンドの共通面接の質問（1）----フロントエンド

1. 意味はNaN：

数ではなく、数タイプ。確認しますますisNaNを

2. == ===との違い：

同じの代わりに== ===厳密に同じに代わって。

　　：==ダブル等号

　　（1）二つの値が同じタイプである場合、次の3つの等号（===）と比較します

　　二つの異なる値の型は、等しいがあるかもしれない場合には（2）には、次のルールに従って比較してキャストする必要があります。

　　　　nullの場合は1）、Aは、等しい未定義です

　　　　2）文字列、数値、文字列の変換後の値と比較し、次いで場合

　　===第三の数：

　　（1）タイプが異なる場合、それらは等しくないであろう

　　NaNで、次に等しくない場合の少なくとも一方は、二つの値が等しい同じ値が、であり、（2）場合。（値がNaNかどうかを判断し、唯一決定するますisNaN（）を使用）

　　（3）は、2つの各位置のための文字列である場合、等しいと等しくない、または同一です。

　　（4）2つの値が等しいその後、真または偽である場合

　　（5）両方の値が同じオブジェクトまたは関数を参照する場合、等しい、または等しくありません

　　（6）2つの値が等しいその後、ヌル、または未定義である場合

3.nullと未定義の違い：

ヌル「ヌル」のヌルタイプ、NULLオブジェクトポインタの代表、typeof演算を「オブジェクト」を与えるために、特別なオブジェクトの値であると考えることができます。

未定義：不定タイプは、変数の宣言が初期化されていない場合、取得は未定義です。

どのようなリスクの4.typeofバー===「オブジェクト」の検証：

nullは値がnullの場合、問題となり、また、オブジェクトであります！

JQ解决方法：（バー== nullで！）&&（typeof演算バー=== "オブジェクト"）&&（$ .isArray（バー）！）

5.getポスト差：

（1）可視た.url： GET、POST、URLパラメータ見パラメータURLが表示されていません

パケットボディ内のHTTP POSTデータ（requrest体）; URLとの間に接続されたパラメーターを、＆するためにデータを分割して送信する：URLに要求されたデータを取得する、すなわち、HTTPプロトコル、フォーマットのヘッドは？

（2）:.送信されたデータのサイズ
4K-2Kの送信データサイズを超えない、典型的にはGET
、POST要求データは無限であってもよい送信php.iniの設定ファイルのサイズに応じて設定されます

（3）データ送信:.
、URL連結することによって渡されるパラメータGET
、POSTは、パラメータは、本体部材を透過します

反応の（4）バックページ：
要求されたページを取り戻すことは影響はありません
バックページを投稿し、再提出要求、要求に応じて

（5）キャッシュの:.
要求がキャッシュされているGET
、POSTリクエストをキャッシュすることはできません

（6）安全性：
安全原則的には、セキュリティのポストを得るよりも確かに良くない、すべての後に、目に見えるURL送信パラメータではなく、また、一部の人がその忙しい右劇に巻き込ま停止することはできません、ブラウザのキャッシュを取得します要求されたデータ。安全性は個人的に真実である紳士は抗抗悪役ではありません、それはあまり変わらないと思います。渡されたパラメータを暗号化するには、実際に、彼らは同じです。

（7）に.getのURLリクエストのみエンコーディング、エンコーディングPOSTの様々なサポートしています

（8）に.getリクエストパラメータは、ブラウザの履歴にフルに保持され、POSTパラメータが保持されません

（9）に.getは唯一のパラメータASCII文字のデータ・タイプを受け入れ、しかし制限ポストはありません

厳格な6.use使用はどのようなものです：

<script>  
  "use strict";  
  console.log("这是严格模式。");  
</script>

「strictモード」の利点の設立：

不合理なJavascriptの構文を排除し、厳格でない場所、奇妙な行動の一部を削減します。
不安コード実行の一部を削除し、コードの安全な動作を確保するために、
コンパイラの効率を向上させる、動作速度を向上させます。
Javascriptの今後の新しいバージョンへの道を開きます。

注意：IE6,7,8,9をテストした後strictモードをサポートしていません。

短所：
他の人がいない間、今JSのサイトは、strictモードでいくつかのファイルを圧縮します。そして、これらの文書は、strictモードだったかもしれない、マージした後、文字列がstrictモードを示しますが、圧縮無駄バイトの後にはなかっただけでなく、ファイルの真ん中に行ってきました。

7.ウィンドウオブジェクトが何であるかをドキュメントオブジェクトは、どのようなものです。違いは？

これは、のドキュメントオブジェクトのプロパティウィンドウです。
Windowオブジェクトは表しブラウザウィンドウを開くために。

文書は、フレーム（フレームまたはiframeタグ）が含まれている場合、ブラウザは、のようになるHTMLがドキュメントウィンドウオブジェクトを作成し、各フレームのための追加のウィンドウオブジェクトを作成します。
グローバル関数やオブジェクトのすべては、Windowオブジェクトのプロパティとメソッドを属します。
文書が読み取り専用のドキュメントオブジェクトへの参照します。

差：
1、ウィンドウフォームを指します。文書には、ページを指します。文書は、子ウィンドウオブジェクトです。
（これは、ドキュメントの現在の表示位置であるため）2、ユーザがはdocument.locationを変更することはできません。（現在の文書を交換するために他の文書を使用して）しかし、あなたはそれ自体が目的ではなく、オブジェクトはdocument.locationでwindow.locationのwindow.locationのを変更することができます

8.プロトタイプチェーン：コンストラクタのプロトタイプオブジェクト三人の関係のオブジェクトインスタンス：

[画像ソースステーションは、セキュリティチェーン機構を有していてもよい、チェーンが失敗したダンプ、ダウン直接アップロード画像を保存することをお勧めします（IMG-SVBgy4Ar-1570936189664）（D：\ W519L \デスクトップ\ 8c2dd16ea9e6ae9fa0b01128045ce3a2.jpg）]

9.applyとの関係を呼び出します。

/*apply()方法*/
function.apply(thisObj[, argArray])

/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);

差：呼び出し及び適用は、他のオブジェクトと現在のオブジェクトを置き換えるために、オブジェクトのメソッドを呼び出すことです。差は、伝送パラメータは、2つのパラメータのみの最大適用することである - 配列は例外TypeErrorの引数がエラーでない場合は、このオブジェクトargArrayの新しい配列を、

10.どのような代替画像の方法？

キャンバスの描画、FontAwesomeアイコンライブラリ。

11.MVC、MVVMフレームワークの原則：

MVC：ビューに全体のフロントページには、コントローラは、モーダルは、コントローラ（制御）着信モデル（データソース）は、データソースによって上記変更表示データに応答を通して、ビューを変更します。

MVVMは：モデルにイベントをバインドDOMリスナーのビュー・モデルにより、モデル、ビュー、モデル、ビューの表示を参照してください、とモデルビューは、接続するブリッジを果たし、データバインディング、ビュー・モデルを介してデータを管理することです役割。

データの分離を達成するために、図では1、
2、データがビューによって駆動され、開発者が唯一の懸念データの変更を必要とする、DOM操作がカプセル化されます。

12.何が起こったのかレンダリングからページへのURLを入力してください？

1.ネットワーク通信

アドレス解決、ドメイン名のDNS解決を解析、3ウェイハンドシェイクのTCPサーバーを見つけ、IPアドレスと、ARPによって、サーバとクライアント（ブラウザ）、リンクを確立します。サーバーを待って、データを送信するために、ブラウザは、サーバーはそれに応じて、要求と要求を処理します。ブラウザは、HTMLコードを取得し、要求を受け取ります。↓

2.ページのレンダリング

基本的なプロセス

1。HTMLファイルを解析、DOMツリーを作成

2。CSSを解析し、CSSオブジェクトモデルフォーム

3。レンダリングツリーを構築するためのCSSやDOMの合併、（renderingtree）

4。レイアウトと描画

13.どのような方法は、オブジェクトを作成する必要がありますか？

1、工場出荷時のパターン

ファクトリパターン
2、モデルのコンストラクタ

ファンクションモード

3、プロトタイプモデル

プロトタイプモード

何14.newオブジェクトのインスタンスが発生します。

新しいオブジェクトの作成1、
2、コンストラクタの範囲は新しいオブジェクト（この）を割り当てる
。3、コンストラクタコード（新しいオブジェクト属性に追加）の実装
目的に4戻ります。

15.基本データ型と参照データ型の違いは何ですか？

基本データ型：（ES6のための）数はザ・、文字列、論理値、ヌル、未定義、シンボル、これらのタイプは、直接操作変数の実際の値に保存することができます。

参照データ型：オブジェクト（基本データ型は、オブジェクト、データオブジェクトであるにJSの他に、オブジェクトが関数であり、オブジェクトが正規表現です）

違い：

あなたが別の変数のメモリ割り当てを宣言する1、

図2に示すように、異なるメモリ割り当ては、異なるアクセスメカニズムをもたらします

3、異なる変数のコピー

図4に示すように、渡された各種パラメータ（プロセスパラメータにコピー引数）

16.機能と矢印の正常な機能の違いは？

機能アロー：

let fun = () => {
    console.log('lalalala');
}

正常な機能：

function fun() {
    console.log('lalla');
}

機能で無名関数を矢印、コンストラクタとして、あなたは新しいを使用することはできませんではありません

この関数は常にこのコンテキストを指す矢印である、任意の方法は、コールとしてその点を、（変更できない）、バインド（）（）適用します
この時点では、そのオブジェクトの正常な機能を呼び出すために

いくつかの方法の重複排除の17アレイ

1.定义一个新数组，并存放原数组的第一个元素，然后将元素组一一和新数组的元素对比，若不同则存放在新数组中。
2.先排序在去重，先将原数组排序，在与相邻的进行比较，如果不同则存入新数组
3.利用对象的属性去重（推荐），每次取出原数组的元素，然后再对象中访问这个属性，如果存在就说明重复
4.利用下标查询
5、利用ES6的set
   Set数据结构，它类似于数组，其成员的值都是唯一的。利用Array.from将Set结构转换成数组

18 ES6のセットを使用する利点：

より簡単：再配列、和、積、差に。

交換することができるもの19.forサイクル：

// reduce写法
sum = arr.reduce(function (prev, cur, index, arr) {
 return  prev + cur;
});
console.log(sum);
//forEach写法
    sports.forEach(function (item) {
        item.sex = '男';
    })
    console.log(sports);

のオブジェクトをトラバースするには、いくつかの方法を20.js

最初：中......のために

第二：

1）、Object.keys（OBJ）

2）、Object.values（OBJ）

21.vueライフサイクル：

新しいVUE→→→→コンポーネントの初期化だけで完了し、テンプレート→→→→コンパイラコンパイラの構成を作成するために輸入部品に依存→→→→作成されてい→→→→はVUEを確認し、テンプレート属性の設定がバウンド要素を交換するためにバインドされているチェック→→→→→→→→→コンポーネントの更新→→→→→→コンポーネントのアップデートの前に→→→→→後のライフサイクルの終わりをマウントし、コンパイル