Penjelasan terperinci tentang kaedah penulisan alternatif kemahiran JavaScript_javascript

JavaScript ialah bahasa skrip untuk Internet!

JavaScript digunakan oleh berjuta-juta halaman web untuk menambah baik reka bentuk, mengesahkan borang, mengesan penyemak imbas, mencipta kuki dan banyak lagi.

JavaScript ialah bahasa skrip yang paling popular di Internet.

JavaScript mudah digunakan! Anda akan menyukainya!

JavaScript ialah bahasa skrip yang ditafsirkan dengan sintaks yang fleksibel, membenarkan orang yang berbeza menulis fungsi yang sama dalam pelbagai cara yang berbeza. Bagaimana untuk mengatur kod JavaScript supaya orang lain dapat melihat sekilas bahawa anda tidak mudah? Adakah anda benar-benar menantikan orang lain berseru "Jadi anda masih boleh menulisnya seperti ini" selepas membaca kod anda?

N cara untuk menulis fungsi tanpa nama

Fungsi tanpa nama JS ialah fungsi laksana sendiri tanpa mengisytiharkan nama fungsi Formatnya adalah seperti berikut:

(function(){})();

Malah, dalam projek kami sering menambah ";" di hadapan:

;function(){}();

Oleh kerana sintaks JS, koma bertitik boleh ditinggalkan, tetapi mekanisme ini juga boleh menyebabkan ralat yang tidak dijangka. Untuk mengelakkan ralat sintaks yang disebabkan oleh penggabungan dan pemampatan kod ke dalam satu fail selepas ia masuk dalam talian, menambah ";" boleh mengelakkan ralat yang tidak diketahui.

Tetapi kadangkala kita melihat fungsi tanpa nama ditulis seperti ini dalam perpustakaan atau pemalam orang lain:

+function(){}();

"+" ialah pengendali di sini, dan pengendali mempunyai keutamaan yang sangat tinggi, jadi pengisytiharan fungsi di sebelah kanan ditambah kurungan (sebenarnya cara fungsi ditulis) dilaksanakan secara langsung. Malah, ia bukan sahaja boleh didahului oleh tanda "+", tetapi juga operator seperti "-", "!", "~", dan "++" boleh digunakan. Ini hanyalah pengenalan lanjutan Kaedah penulisan khusus bergantung pada piawaian bersatu pasukan.

Tinggalkan Math.ceil() dan Math.floor rounding

Mungkin anda pernah melihat dua simbol ini ~~ dan |0 dalam kod lain, lihat sahaja hasil yang sedang dijalankan:

>> var a1 = 1.23
>> ~~a1
1
>> var a2 = 2.345
>> a2|0
2
>> var a3 = -3.45
>> ~~a3
-3
>> var a4 = -4.5
>> a4|0
-4

Sila ambil perhatian bahawa cara penulisan ini bukanlah asli, ia hanya dipetik untuk menganalisis dan menerangkan cara penulisan alternatif ini. Diterangkan secara ringkas, ~ ialah operator penolakan bitwise, yang boleh menukar nombor titik terapung kepada integer dengan membuang semua digit selepas titik perpuluhan. Integer positif boleh ditukar kepada nilai heksadesimal tidak bertanda. Kemudian menafikannya sekali lagi (~~) untuk mendapatkan integer asal. Jika anda begitu bersungguh-sungguh dan tidak suka melaraskan kaedah, adakah anda fikir ia adalah pengoptimuman?

Nota: Jika anda perlu melakukan operasi pembundaran yang ketat, anda harus menggunakan kaedah ini dengan berhati-hati, kemudian anda masih perlu menggunakan fungsi Matematik.

jika dan selainnya bukan satu-satunya

Pertimbangan bersyarat menggunakan if-else adalah logik yang sangat jelas, tetapi ia tidak kelihatan sangat ringkas apabila jumlah data yang diproses tidak besar:

if (a===1) { //此处强烈建议用严格等于符号“===”，不会进行类型转换
a=2
} else if (a===3) {
a=4
} else {
a=5
}

Lihat menggunakan || dan && untuk mengurangkan kod:

((a===1)&&(true,a=2))||((a===3)&&(true,a=4))||(a=5)

Selesaikannya hanya dalam satu langkah dan turunkan berat badan dengan jayanya. ||. dan &&, tidak perlu dikatakan bahawa prinsipnya sangat mudah. ​​Pengendali koma yang digunakan di dalamnya tidak mudah difahami

(a===1 )? a=2:( (a===3) ? (a=4) : (a=5) )

var template = "<div>" 
+ "<h2>{title}</h2>"
+ "<div class='content' yAttr=''>{content}</div>"
+ "</div>"

var template = <div> 
<h2>{title}</h2> 
<div class='content' yAttr=''>{content}</div> 
</div>

var rComment = /\/\*([\s\S]*?)\*\//;
// multiply string 
function ms(fn){ 
return fn.toString().match(rComment)[1]
}; 
ms(function(){/* 
<div> 
<h2>{title}</h2> 
<div class='content' yAttr=''>{content}</div> 
</div> */
})

Tambah sokongan modul AMD, kotak kod gesaan B

(function( factory ) { 
if ( typeof define === "function" && define.amd ) { 
// AMD模式。且依赖"jQuery"这个插件 
define( [ "jquery" ], factory ); } 
else { 
// 浏览器全局模式 
factory( jQuery ); 
} 
}(function( $ ) { 
// 这里放模块代码 
return $.widget; 
}));

Warisi kaedah optimum

function Empty(){}
Empty.prototype = Parent.prototype;
Child.prototype = new Empty();
Child.prototype.constructor = Child;