Rumah  >  Artikel  >  hujung hadapan web  >  Tujuh perkara yang perlu diambil perhatian semasa mempelajari JavaScript [mesti dibaca]_Pengetahuan asas

Tujuh perkara yang perlu diambil perhatian semasa mempelajari JavaScript [mesti dibaca]_Pengetahuan asas

WBOY
WBOYasal
2016-05-16 15:02:211313semak imbas

Penerangan pengetahuan:

Apabila mempelajari JavaScript, beri perhatian kepada tujuh butiran berikut untuk menjadikan kod kami lebih mudah difahami dan lebih cekap sambil mencapai fungsi yang sama.

1. Kod ringkas

Contoh: Cipta objek

Ia seperti ini sebelum ini:

Kereta Var = objek baharu();

Car.color = “merah”;

Roda kereta = 4;

Umur kereta = 8;

Dan kini ia boleh ditulis seperti ini:

Kereta Var = {warna:'merah', roda:4, umur:8}

Contohnya: Buat tatasusunan

Ia seperti ini sebelum ini:

Var studentArray = new Array('zhangsan', 'lisi', 'zhaowu', 'wuliu');

Dan kini ia boleh ditulis seperti ini:

Var studentArray = {‘zhangsan’, ‘ lisi’, ‘zhaowu’, ‘wuliu’};

Contoh: Gunakan operator ternary untuk memudahkan kod

Tulisan

sebelum ini ialah:

Var result;

if(x > 100)

{

    Result = 1;

}else{

    Result = -1;

}

Dan kini ia boleh ditulis sebagai:

Hasil var = x >100 ?

2. Gunakan JSON sebagai format data

Gunakan format Json untuk menyimpan data:


var band = {

 "name":"The Red Hot Chili Peppers",

 "members":[

  {

   "name":"Anthony Kiedis",

   "role":"lead vocals"

  },

  {

   "name":"Michael 'Flea' Balzary",

   "role":"bass guitar, trumpet, backing vocals"

  },

  {

   "name":"Chad Smith",

   "role":"drums,percussion"

  },

  {

   "name":"John Frusciante",

   "role":"Lead Guitar"

  }

 ],

 "year":"2009"

}
Anda juga boleh menggunakan JS untuk menyimpan data, kodnya adalah seperti berikut:


<div id = “dataDiv”></div>

<script>

    Function saveData(data)

{

    Var out =“<ul>”;

    For(var i=0; i<data.length; i++)

{

    Out += “<li><a href =”'+data[i].url+'”>+

data[i].d+</a></li>”;

}

Out += ‘</ul>';

Document.getElementById(‘dataDiv').innerHTML = out;

}

</script>
Anda juga boleh menggunakan data tersimpan yang dijana oleh JS di atas sebagai nilai pulangan API

e689660efc10baf32b3614d0f3fc8ed4

713e1e4451c8393b8e637e129c6b7b12

3. Cuba gunakan fungsi asli JavaScript

Contohnya: Dapatkan nilai maksimum dalam set data

var maxData = Math.max(0,20,50,10);

alert(maxData); //Nilai maksimum yang dikembalikan ialah 50

Contohnya: Gunakan JS untuk menambah gaya kelas pada elemen Coretan kod adalah seperti berikut:

Function addClass(elm, newclass)

{

    Var classes = elm.className.split(‘ ‘ );

    Classes.push(newclass);

    Elm.className = classes.join(‘ ');

}

4. Delegasi acara

Contohnya:


<h2>Great Web resources</h2>

<ul id="resources">

 <li><a href="http://opera.com/wsc">Opera Web Standards

Curriculum</a></li>

 <li><a href="http://sitepoint.com">Sitepoint</a></li>

 <li><a href="http://alistapart.com">A List Apart</a></li>

 <li><a href="http://yuiblog.com">YUI Blog</a></li>

 <li><a href="http://blameitonthevoices.com">Blame it on the

voices</a></li>

 <li><a href="http://oddlyspecific.com">Oddly specific</a></li>

</ul>
Cara terbaik untuk menulis skrip:


(function(){

 var resources = document.getElementById('resources');

 resources.addEventListener('click',handler,false);

 function handler(e){

  var x = e.target; // get the link tha

  if(x.nodeName.toLowerCase() === 'a'){

   alert('Event delegation:' + x);

   e.preventDefault();

  }

 };

})();

5. Fungsi tanpa nama

var myApplication = function(){

 var name = 'Chris';

 var age = '34';

 var status = 'single';

 function createMember(){

  // [...]

 }

 function getMemberDetails(){

  // [...]

 }

 return{

  create:createMember, get:getMemberDetails

 }

}();

//myApplication.get() and myApplication.create() now work.

6. Kod boleh dikonfigurasikan

Jika anda mahu kod yang anda tulis lebih mudah digunakan atau diubah suai oleh orang lain, ia perlu dikonfigurasikan Penyelesaiannya adalah dengan menambah objek konfigurasi pada skrip yang anda tulis. Perkara utama adalah seperti berikut:

1. Tambahkan objek yang dipanggil konfigurasi dalam skrip anda.

2. Simpan dalam objek konfigurasi semua perkara yang mungkin ingin diubah oleh orang lain, seperti ID CSS, nama kelas, bahasa, dsb.

3. Kembalikan objek ini sebagai harta awam supaya orang lain boleh mengatasinya.

7. Keserasian Kod

Keserasian adalah sesuatu yang sering diabaikan oleh pemula Biasanya apabila mempelajari Javascript, mereka diuji dalam penyemak imbas tetap, dan penyemak imbas ini berkemungkinan besar IE ini sangat membawa maut, kerana pada masa kini beberapa pelayar utama, IE mempunyai sokongan paling teruk untuk piawaian. Hasil yang dilihat oleh pengguna akhir mungkin kod yang anda tulis tidak dapat berjalan dengan betul dalam penyemak imbas tertentu. Anda harus menguji kod anda dalam semua pelayar utama Ini mungkin memakan masa, tetapi ia harus dilakukan.


Tujuh perkara di atas yang perlu diambil perhatian semasa mempelajari JavaScript [mesti dibaca] adalah semua kandungan yang dikongsi oleh editor, saya harap ia boleh memberi rujukan kepada anda, dan saya juga berharap semua orang akan menyokong Script Home.

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn