PART1手書きコード
オンサイトの手書きコードは、最近のインタビューでは非常に一般的なタイプのインタビューの質問であり、基本的なデータ構造とアルゴリズム機能を調べています。
1。配列重複排除の実装
基本的な配列重複排除
array.prototype.unique = function(){var result = []; this.foreach(function(v){if(result.indexof(v)<0){result.push(v);}}); return result;}•ハッシュテーブルを使用して重複排除します。これは時間と空間を交換する方法です
array.prototype.unique = function(){var result = []、hash = {}; this.foreach(function(v){if(!hash [v]){hash [v] = true; result.push(v);}}); return result;}上記の方法にはバグがあります。配列[1,2、 '1'、 '2'、3]の場合、重複排除の結果は[1,2,3]です。その理由は、オブジェクトがインデックスを作成するときにオブジェクトが属性インデックスをキャストするためです。 arr ['1']とarr [1]は両方ともarr [1]の値を取得するため、いくつかの変更を行う必要があります。
array.prototype.unique = function(){var result = []、hash = {}; this.foreach(function(v){var type = typeof(v); // get element element type hash [v] ||(hash [v] = new array()); if(hash [v] .indexof(type)<0){hash [v] .push(type); //ストレージタイプresult.push(v);}); return result;}•最初にソートしてから、繰り返しを削除します
array.prototype.unique = function(){var result = [this [0]]; this.sort(); this.foreach(function(v){v!= result [result.length -1] && result.push(v); // resultの最後の要素とのみ});}2クイックソートの実装
方法1(JSアレイメソッドを可能な限り使用しないでください):
関数QuickSort(arr){qsort(arr、0、arr.length -1);} function qsort(arr、low、high){if(low <high){var partkey = pertition(arr、low、high); qsort(arr、low、partkey -1); qsort(arr、partkey + 1、high); }}関数パーティション(arr、low、high){var key = arr [low]; //最初の要素を分類基準として使用します。 arr [low] = arr [high]; while(low <high && arr [low] <= arr [key])low ++; arr [high] = arr [low]; } arr [low] = key;低く戻ります;}方法2(JSアレイメソッドを使用):
関数QuickSort(arr){if(arr.Length <= 1)return arr; var index = math.floor(arr.length/2); var key = arr.splice(index、1)[0]; var left = []、right = []; arr.foreach(function(v){v <= key?left.push(v):right.push(v);}); quicksort(左).concat([key]、quicksort(右));}さらに、最悪のケースは整然としたケースであり、時間の複雑さはn、クイックソートが不安定であることに注意することに注意する必要があります。
PART2 JavaScript関連
1 JavaScriptの基本データ型
JavaScriptデータ型には、プリミティブタイプと参照タイプが含まれています。5つの原始的なタイプがあります。
number(value)string(string)boolean(boolean)null(empty)未定義(未定義)
参照タイプがあります:
オブジェクト(オブジェクト)
typeof(x)を介して、変数xのデータ型 "number"、 "string"、 "boolean"、 "object"、および「object "を返すことができます。ここで注意すべきことの1つは、Typeofオペレーターがnullタイプのオブジェクトを返します。
「JavaScript Advanced Programming」:
これは、実際にはJavaScriptの初期実装のバグであり、後にECMAScriptによって使用されました。 Nullは現在、オブジェクトのプレースホルダーと見なされているため、この矛盾を説明しています。しかし、技術的には、それはまだ元の価値です。
2 JavaScript Scope Chainについて話します
JavaScriptコード(グローバルコードまたは関数)の一部を実行すると、JavaScriptエンジンは、実行コンテキストとも呼ばれるスコープを作成します。ページがロードされると、最初にグローバルスコープが作成され、その後、各関数が実行され、対応するスコープが確立され、スコープチェーンが形成されます。各スコープには対応するスコープチェーンがあり、チェーンのヘッドはグローバルスコープであり、チェーンの尾は現在の関数範囲です。
スコープチェーンの目的は、識別子を解析することです。関数が作成されると(実行されていません)、これ、引数、名前付きパラメーター、および関数内のすべてのローカル変数が現在の範囲に追加されます。 JavaScriptが変数xを見つける必要がある場合(このプロセスは変数解像度と呼ばれます)、まずスコープチェーンのチェーンの端からx属性、つまり現在のスコープがあるかどうかを検索します。発見されていない場合は、チェーンヘッド、つまりグローバルスコープチェーン、変数が見つからないまでスコープチェーンに沿って検索し続けます。このコードのスコープチェーンにx変数はないと考えられており、参照エラー(参照エラー)例外がスローされます。
3 JavaScriptプロトタイプチェーンを理解する方法
JavaScriptの各オブジェクトにはプロトタイプ属性があり、これをプロトタイプと呼び、プロトタイプの値もオブジェクトであるため、プロトタイプチェーンを接続する独自のプロトタイプもあります。プロトタイプチェーンのヘッダーはオブジェクトであり、そのプロトタイプは比較的特別で、nullの値があります。
プロトタイプチェーンの機能は、オブジェクトの継承に使用されます。関数Aのプロトタイププロパティはオブジェクトです。この関数がインスタンスを作成するコンストラクターとして使用される場合、関数のプロトタイププロパティはプロトタイプとしてすべてのオブジェクトインスタンスに割り当てられます。たとえば、新しい配列を作成すると、配列メソッドは配列のプロトタイプから継承されます。
オブジェクトの属性にアクセスするときは、最初にオブジェクト自体を探して、見つかった場合は返します。発見されていない場合は、プロトタイプオブジェクトのプロパティを探し続けます(まだ発見されていない場合は、実際にプロトタイプチェーンに沿ってルートまで上方に検索します)。上書きされていない限り、オブジェクトプロトタイプの特性はすべての場合に見つけることができ、プロトタイプチェーン全体が見つからない場合、未定義になります。
4事前にJavaScript変数宣言
JavaScriptの権威あるガイドはこれを説明しています。JavaScript変数は宣言の前に利用可能であり、JavaScriptのこの機能は非公式にHoistingと呼ばれます。つまり、JavaScript関数で宣言されたすべての変数(割り当てを含む)は関数の上部に「高度」です。
例から:
var scope = "global"; function myfunc(){console.log(scope); var scope = "local";}コンソールが印刷するのは、「グローバル」ではなく「未定義」です。これは、関数myfuncの範囲で、ローカル変数スコープ宣言が関数の最上位に進められるためです。現時点では、スコープは値のみを宣言し、値を割り当てないため、出力は未定義です。実際、上記のコードは以下と同じです。
var scope = "global"; function myfunc(){var scope; console.log(scope); scope = "local";}5 JavaScriptの閉鎖を理解して適用する方法
閉鎖の特定の定義に関する文献に記載されている概念は、非常に抽象的です。閉鎖は、他の関数のすべてのローカル変数に関数を可能にする構文メカニズムだと思います。
例えば:
function outfunc(){var name = "vicfeel"; function infunc(){console.log(name); } return infunc;} infunc(); //コンソールは「vicfeel」を表示しますこの例では、OutFuncのローカル変数名に関数Infuncでアクセスできることがわかります。
閉鎖アプリケーションの例は、クラスの私的特性をシミュレートします。閉鎖のプロパティを活用すると、ローカル変数はSayageメソッドでのみアクセスできます。また、名前も外部からアクセスできるため、クラスの私的プロパティを実装します。
function user(){this.name = "vicfeel"; //合計属性var age = 23; //プライベート属性this.sayage:function(){console.log( "my age is" + age); }} var user = new user(); console.log(user.name); // "Vicfeel" Console.log(user.age); //「未定義」user.sayage(); //「私の年齢は23歳です」閉鎖の詳細については、Ruan Yifengのネットワークログ - JavaScriptの閉鎖(閉鎖)を学ぶことをお勧めします。
6新しい建設オブジェクトの本質
function user(){this.name = "vicfeel"; this.age = 23;} var user = new user();新しいオペレーターを通じて、実際にはコンストラクターユーザーで次の操作が完了します。
•タイプがオブジェクトである新しいオブジェクトを作成します。
•コンストラクターに設定されたこの新しいオブジェクトの内部、アクセス可能、およびプロトタイプのプロパティを設定します(プロトタイプ.Construtorによって指摘されたコンストラクターを参照)。
•コンストラクターを実行します。
•新しく作成されたオブジェクトを返します。
function user(){// this = {}; //this.constructor = user; this.name = "vicfeel"; this.age = 23; //これを返します。 } var user = new user();コンストラクターがデフォルトで新しく作成されたこのオブジェクトを返す場合、変数が手動で返される場合、変数が元のタイプである場合、それがオブジェクトである場合、それは返されます。
7 JavaScriptエージェント
多くの要素にイベントを追加する必要がある場合、親ノードにイベントを追加し、イベントを親ノードに委任することにより、処理機能をトリガーできます。
たとえば、多くのLiをULに動的に追加する必要があります。Clickイベントを1つずつ追加するには、LIを横断する必要があります。
<ul id = 'list'> </ul> var count = 100; var ullist = document.getElementById( "list"); //(var i = count; i - ;){var lidom = document.createelement( 'li'); ullist.appendchild(lidom); } //バインディングクリックイベントvarlinode = ullist.getElementByTagname( "li"); for(var i = 0、l = linodes.length; i <l; i ++){linode [i] .onclick = function(){// liクリックイベント}}}誰もが知っているように、DOM操作は非常にパフォーマンスを消費しています。したがって、繰り返されるイベントバインディングは、単にパフォーマンスキラーです。イベントプロキシの中心的なアイデアは、できるだけ少ないバインディングを通じてできるだけ多くのイベントを聞くことです。それをする方法は?答えは、イベントバブルメカニズムを使用して親ノードUL(イベントバブル)に結合し、event.targetを使用してイベントをトリガーするノードを決定し、それにより多くのイベントハンドラーの結合を減らすことです。
var count = 100; var ullist = document.getElementById( "list"); //(var i = count; i - ;){var lidom = document.createelement( 'li'); ullist.appendchild(lidom); } //バインディングクリックイベントvarlinode = ullist.getElementByTagname( "li"); linode.onclick = function(e){if(e.target && e.target.nodename.touppercase == "li"){// liクリックイベント}}}新しいコンテンツは継続的に更新されます...