Ringkasan tips Javascript biasa_tips javascript

Contoh dalam artikel ini menerangkan petua Javascript biasa. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

1. Ungkapan Boolean Betul dan Salah

Ungkapan Boolean berikut semuanya kembali palsu:

null
tidak ditentukan
'' rentetan kosong
0 nombor 0

Tetapi berhati-hati dengan perkara berikut, semuanya kembali benar:

'0' rentetan 0
[] Tatasusunan kosong
{} objek kosong

Kod mengerikan berikut:

Salin kod Kod adalah seperti berikut:

manakala (x != null) {

Anda boleh menulisnya terus dalam bentuk berikut (selagi anda mahu x menjadi selain daripada 0 dan rentetan kosong, dan palsu):

Salin kod Kod adalah seperti berikut:

sementara (x) {

Jika anda ingin menyemak sama ada rentetan adalah batal atau kosong:

Salin kod Kod adalah seperti berikut:

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

Tetapi ini lebih baik:

Salin kod Kod adalah seperti berikut:

jika (y) {

Nota: Masih banyak perkara yang perlu diberi perhatian, seperti:

Boolean('0') == benar
'0' != benar
0 != null
0 == []
0 == palsu
Boolean(null) ==salah
null != benar
null != palsu
Boolean(undefined) ==false
undefined != benar
undefined != false
Boolean([]) == benar
[] != benar
[] == palsu
Boolean({}) == benar
{} != benar
{} != palsu

2. Pengendali bersyarat (ternari) (?:)

Pengendali ternary digunakan untuk menggantikan kod berikut:

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

Anda boleh menulis:

Salin kod Kod adalah seperti berikut:

return foo() : bar();

Juga berguna apabila menjana kod HTML:

Salin kod Kod adalah seperti berikut:

var html = '';

Tiga, && dan ||

Pengendali Boolean Perduaan boleh litar pintas, dan item terakhir hanya akan dinilai apabila perlu.

"||" dipanggil operator 'lalai' kerana ia berfungsi seperti ini:

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

Anda boleh menggunakan ini untuk memudahkan kod di atas:

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

"&&" juga boleh menjadi kod pendek. Contohnya:

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

Anda boleh menggunakannya seperti ini:

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

atau:

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

Tetapi ini agak berlebihan:

Salin kod Kod adalah seperti berikut:

nod && node.kids && node.kids[index] && foo( node.kids [indeks]);

4 Gunakan join() untuk mencipta rentetan

biasanya digunakan seperti ini:

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

Tetapi ini sangat perlahan di bawah IE Anda boleh menggunakan kaedah berikut:

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

Anda juga boleh menggunakan tatasusunan sebagai pembina rentetan, dan kemudian tukarkannya menjadi rentetan melalui myArray.join('' Walau bagaimanapun, memandangkan operasi penugasan lebih pantas daripada push() tatasusunan, cuba gunakan operasi tugasan.

5. Senarai Nod Traverse

Senarai nod dilaksanakan dengan menambahkan penapis pada iterator nod Ini bermakna kerumitan masa untuk mendapatkan atributnya, seperti panjang, ialah O(n), dan merentasi keseluruhan senarai melalui panjang memerlukan O(n^2. ).

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

Ini akan menjadi lebih baik:

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

Kaedah ini berfungsi untuk semua koleksi dan tatasusunan (selagi tatasusunan tidak mengandungi nilai palsu).

Dalam contoh di atas, anda juga boleh melintasi nod anak melalui FirstChild dan nextSibling.

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

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.