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

リトル言及インタビューの中で、インタビュアーはその後、ひざまずく、あなたのプロジェクトの詳細を中心に求めることができる、1は書き込まない場合は、何をしたかの項目を参照するために、プロジェクトの練習を見るのが好き。（自分がやっていくつかのプロジェクトは非常に重要です）

ボディパーツ：

1.var、constの違いをみましょう：

（1）.var変数が高めることができる：可変リフトは何ですか？

var a=10   //全局变量
function fn() {
  console.log(a);//输出undefined
  var a=20;//var会把a这个声明提到作用域的顶端，var a；
  console.log(a);//20
}
fn()
console.log(a);//10

//上面的代码与下面的等同！

var a=10   //全局变量
function fn() {
  var a;  //只是声明放在顶端，值还在原来的位置！！！！而且以声明就把a局部重置了！！！
  console.log(a);//输出undefined，a局部重置了，重置了还没有值！！！
  a=20;//var会把a这个声明提到作用域的顶端，var a；
  console.log(a);//20
}
fn()
console.log(a);//10

可変リフト：ちょうど値を言及しないように、文を言及します！

注意：クラス宣言クラスを、可変リフトは存在しません。

（2）constとして宣言し、彼だけが宣言しているの影響をブロック.let。

割り当てられます（3）.const宣言の後に変更することはできません！

注：オブジェクトのconstの宣言は、値をロックするObject.freeze（）を使用することができます。

基本データ型を2.js：

ブール値、ヌル、数、underfined、文字列、オブジェクト、シンボル（ES6新增）

そして、シェーンは、シンボルのですか？

ユニークな値を表します
パラメータを追加することができる宣言、および説明に
これは、キーとして横断することはできません

3.どのように携帯端末の適応？

ブートストラップフレームワークと他のUI
REM
VWとVH

4.あなたはどのようにフロントエンドで学び、どのようにあなたは、特定の技術（VUE）を学びましたか？

これは、あなたがトレーニングコースから外れていないかどうかを確認するために、一般的な問題でなければなりません。実際に、私は知らない、彼らはこの特定の意味を尋ねます。

クロスドメインの問題を解決する方法5.：

クロスドメインの問題は、各個別の前後端が遭遇することです。

通常、クロスドメインのエラーすることはできません。。。。CORS。。。。

問題となっ説明CORS。主に達成するための設定、アクセス制御 - 許可 - 原点を通ります。

私はそれがCORSをインストールすることで、依存しているノードを、使用しています。

//cors跨域问题
const cors = require('cors');  
app.use(cors({  
    origin:['http://localhost:8080'],
    methods:['GET','POST'],
}));

//跨域问题解决方面
app.all('*',function (req, res, next) {
  res.header('Access-Control-Allow-Origin', 'http://localhost:8080');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
　next();　
});

どちらも、あなたが一緒にそれを使用するかわからない、良いです。

6.xmlとJSONの違い：

JSONのような人々は、データは、簡単にこのデータを使用してアプレット、Webアプリケーション、ウェブサイトを簡潔、かつ幸い呼び出します。

体積：JSONのXMLに対して、より小さな、より速い伝送。
相互作用：JSONとjsの相互作用をより便利で簡単に解析処理、優れたデータの相互作用。
レベル：XMLヘビー級、JSONは軽量です。
説明：比XMLの記述JSON差データ。
分析：JSON可能なジャクソンは、他の分析方法、XML利用可能DOM、SAX、gsonなどを解析しdemo4j。

どの命令が7.Vueがありますか？

V-HTML、V-ショー、V-IF（V-他に、V-ELSE-IF）、V-ため、V-マント、V-テキスト、V-バインド、Vモデル、V-前

8.どのようにフロントエンドのWebサイトのパフォーマンスを最適化するには？

HTTPリクエストの数を減らします
- CSSスプライト：家庭一般CSSスプライトとして知られている、HTTP要求を低減する解に到達するために、1枚の画像に複数の画像をマージすることで、映像コンテンツは、CSSの背景プロパティを介してアクセスすることができます。このアプローチは、画像内のバイトの総数を減らすことができます。
- 組み合わせCSSやJSファイル：ようにうなり声、一口、WebPACKのと：今のようなフロントエンドエンジニアリング・パッケージングツール、たくさんあります。HTTPリクエストの数を減らすために、これらのツールは、CSSの複数の前に再び放出されたか、JSファイルの複数に結合することができます。
- lazyLoad使用：一般的に遅延ロードとして知られているが、ユーザーが実際に内容をロードするためにすぐに操作を必要とするまで、要求せずに、最初にロードすることなく、ページのコンテンツを制御することができます。Webリソースの数を制御するには、このワンタイム要求。
制御リソースファイルのロードの優先順位
- HTMLコンテンツをロードするブラウザは、HTMLコンテンツが、解決のユーザーにページを表示するために初めて、リンクするか、スクリプトタグが対応するリンクのhrefまたはSRCコンテンツをロードします解決するために、上から下にある、あなたはCSSの前進をロードする必要がありますJSの影響でロードしないでください。
- 通常の状況下では一番下のCSS、JSの先頭にあります
DOM操作とアイコンの使用を減らす代わりにiconfont。マルチユースブラウザのキャッシュ。

彼らのキャリアパスのフロントエンド、どのように計画した後、9？

このようなものは、アイテム課金あり、言って良い点かもしれブラウニーポイントを追加することができます。

10.役割は何ですか？彼らは何をしている、フロントページの三つの層は何ですか？

構造層HTML、プレゼンテーション層のCSS、行動層JS。

11.ブロックレベル要素の？CSSボックスモデルが持っているもの？ラインの要素は何ですか？

ブロックレベル要素：divのPさh1 h2とh3とh4をフォームのUL
インライン要素：スパンI INPUT SELECT BR AB＆
CSSのボックスモデル：コンテンツ、ボーダー、マージン、パディング

約12ボックスモデル：

CSSボックスモデル、二つがあります：IEのボックスモデルは、標準モデルのW3Cボックスモデル
ボックスモデル：内容、パディング、マージン（一般的にボックスの実際の幅に含まれていない）、ボーダー

13.Sass、そのLESS何？なぜ我々はそれらを使用する必要があるのですか？

彼らは、CSSプリプロセッサです。彼らは、CSS上の抽象化層です。彼らは、CSSにコンパイル特殊な構文/言語です。
以下の例では、動的言語のスタイルです。CSS特性がこのような変数、相続、操作、機能などの動的言語を、与えられた。LESSクライアント上で（サポートIE 6+、Webkitのは、Firefox）を実行することができる、それがであってもよく、サーバは、（援助のNode.js）を実行します。
なぜそれらを使用しますか？
クリアな構造、簡単に拡張します。
これは、簡単にプライベート文法ブラウザの違いを遮蔽することができます。これを言うまでもなく、構文ブラウザ繰り返し処理の違いのパッケージは、無意味な機械的な作業を軽減します。あなたは簡単に多重継承を実現することができます。

CSSコードと完全互換簡単に古いプロジェクトに適用することができます。LESS CSSの構文は、拡張のみで作られているので、古いCSSコードは、LESSコードと一緒にコンパイルすることができます。

リンクと@import間14.CSS差は、以下のとおりです。

リンクのタグをHTMLに属し、CSSの@importが提供され
、ページがロードされるとき、リンクにもロードされ、ページはCSSのロードが終了した後、引用文献@import CSSのみがロードされます
のみだけでIE5の上に@importを識別され、リンクはhtmlタグで、ブラウザの互換性の問題が存在しないことができます
右のスタイルをリンク（@importは、現在のページへの参照スタイルをインポートすることである）で@import重要な参照を導入