一般的な Javascript ヒントのまとめ_JavaScript ヒント

この記事の例では、JavaScript の一般的なヒントについて説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

1. True と False のブール式

次のブール式はすべて false を返します:

ヌル
未定義
'' 空の文字列
0 数字 0

ただし、次の点には注意してください。これらはすべて true を返します。

'0' 文字列 0
[] 空の配列
{} 空のオブジェクト

次のひどいコード:

コードをコピー コードは次のとおりです。

while (x != null) {

次の形式で直接記述することができます (x を 0、空の文字列、および false 以外にしたい場合に限ります):

コードをコピー コードは次のとおりです:

while (x) {

文字列が null か空かどうかを確認したい場合:

コードをコピー コードは次のとおりです。

if (y != null && y != '') {

しかし、これはもっと良いでしょう:

コードをコピー コードは次のとおりです。

if (y) {

注: 次のような注意すべき点がまだたくさんあります。

ブール値('0') == true
'0' != true
0 != null
0 == []
0 == false
ブール値(null) ==false
null != true
null != false
ブール値(未定義) ==false
未定義 != true
未定義 != false
ブール値([]) == true
[] != true
[] == false
ブール値({}) == true
{} != true
{} != false

2. 条件付き (三項) 演算子 (?:)

三項演算子は、次のコードを置換するために使用されます:

if (val != 0) {
 return foo();
} else {
 return bar();
}

次のように書くことができます:

コードをコピーします コードは次のとおりです:

return val foo() : bar();

HTML コードを生成するときにも役立ちます:

コードをコピーします コードは次のとおりです:

var html = '';

3、&&、および ||

バイナリ ブール演算子は短絡可能であり、最後の項目は必要な場合にのみ評価されます。

「||」は次のように動作するため、「デフォルト」演算子と呼ばれます。

function foo(opt_win) {
 var win;
 if (opt_win) {
  win = opt_win;
 } else {
  win = window;
 }
 // ...
}

これを使用して上記のコードを簡素化できます:

function foo(opt_win) {
 var win = opt_win || window;
 // ...
}

「&&」は、たとえば、

のように短いコードにすることもできます。

if (node) {
 if (node.kids) {
  if (node.kids[index]) {
   foo(node.kids[index]);
  }
 }
}

次のように使用できます:

if (node && node.kids && node.kids[index]) {
 foo(node.kids[index]);
}

または:

var kid = node && node.kids && node.kids[index];
if (kid) {
 foo(kid);
}

しかし、これは少しやりすぎです:

コードをコピー コードは次のとおりです。

node && node.kids && node.kids[index] && foo( node.kids [インデックス]);

4. join() を使用して文字列

を作成します。

は通常次のように使用されます:

function listHtml(items) {
 var html = '';
 for (var i = 0; i < items.length; ++i) {
 if(i > 0) { html += ', ';
 }
 html += itemHtml(items[i]);
 }
 html +='';
 return html;
}

ただし、IE では非常に遅くなります。次の方法を使用できます。

function listHtml(items) {
 var html = [];
 for (var i = 0; i < items.length; ++i) {
  html[i] = itemHtml(items[i]);
 }
 return '' + html.join(', ') + '';
}

配列を文字列コンストラクターとして使用し、myArray.join('') を通じて文字列に変換することもできます。ただし、代入操作は配列の Push() よりも高速であるため、使用してみてください。代入操作。

5. トラバースノードリスト

ノード リストは、ノード反復子にフィルターを追加することによって実装されます。これは、長さなどの属性を取得するための時間計算量が O(n) であり、長さを通じてリスト全体を走査するには O(n^2 が必要であることを意味します。 ).

var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0; i < paragraphs.length; i++) {
 doSomething(paragraphs[i]);
}

これはもっと良くなります:

var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) {
 doSomething(paragraph);
}

このメソッドは、すべてのコレクションと配列に対して機能します (配列に偽の値が含まれていない限り)。

上記の例では、firstChild と nextSibling を介して子ノードをトラバースすることもできます。

var parentNode = document.getElementByIdx_x('foo');
for (var child = parentNode.firstChild; child; child = child.nextSibling) {
 doSomething(child);
}

この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。