Rumah  >  Artikel  >  hujung hadapan web  >  Penjelasan terperinci tentang kemahiran JavaScript type_javascript

Penjelasan terperinci tentang kemahiran JavaScript type_javascript

WBOY
WBOYasal
2016-05-16 15:14:141387semak imbas

Artikel ini terutamanya memperkenalkan fungsi biasa, fungsi tanpa nama dan fungsi penutupan

Jadual Kandungan

  • Fungsi biasa: Memperkenalkan ciri fungsi biasa: menimpa dengan nama yang sama, objek argumen, nilai pulangan lalai, dsb.
  • Fungsi tanpa nama: Memperkenalkan ciri-ciri fungsi tanpa nama: fungsi tanpa nama berubah, fungsi tanpa nama tanpa nama.
  • Fungsi penutupan: Memperkenalkan ciri-ciri fungsi penutupan.

1. Fungsi biasa
1.1 Contoh

function ShowName(name) {
  alert(name);
}
 

1.2 Penukaran fungsi dengan nama yang sama dalam Js

Dalam JS, fungsi tidak terbeban jika anda mentakrifkan fungsi dengan nama fungsi yang sama dan tandatangan parameter yang berbeza, fungsi kemudian akan menimpa fungsi sebelumnya. Apabila dipanggil, hanya fungsi berikut akan dipanggil.

var n1 = 1;
 
function add(value1) {
  return n1 + 1;
}
alert(add(n1));//调用的是下面的函数,输出:3
 
function add(value1, value2) {
  return value1 + 2;
}
alert(add(n1));//输出:3
 

1.3 argumen objek

argumen adalah serupa dengan param C#, mengendalikan parameter pembolehubah: bilangan parameter yang dihantar ke dalam fungsi adalah lebih besar daripada bilangan parameter apabila ditakrifkan.

function showNames(name) {
  alert(name);//张三
  for (var i = 0; i < arguments.length; i++) {
    alert(arguments[i]);//张三、李四、王五
  }
}
showNames('张三','李四','王五');

1.4 Nilai pulangan lalai bagi fungsi

Jika fungsi tidak menyatakan nilai pulangan, nilai pulangan lalai adalah 'tidak ditentukan'

function showMsg() {
}
alert(showMsg());//输出:undefined
  

2. Fungsi tanpa nama
2.1 Fungsi tanpa nama boleh ubah

2.1.1 Penerangan
Fungsi boleh diberikan kepada pembolehubah dan peristiwa.

2.1.2 Contoh

//变量匿名函数,左侧可以为变量、事件等
var anonymousNormal = function (p1, p2) {
  alert(p1+p2);
}
anonymousNormal(3,6);//输出9

2.1.3 Senario Berkenaan
①Elakkan pencemaran nama fungsi. Jika anda mula-mula mengisytiharkan fungsi dengan nama dan kemudian menetapkannya kepada pembolehubah atau acara, anda akan menyalahgunakan nama fungsi tersebut.

2.2 Fungsi tanpa nama tanpa nama

2.2.1 Penerangan
Iaitu, apabila fungsi diisytiharkan, ia diikuti oleh parameter. Apabila sintaks JS menghuraikan fungsi ini, kod di dalamnya dilaksanakan serta-merta.

2.2.2 Contoh

(function (p1) {
  alert(p1);
})(1);

2.2.3 Senario Berkenaan
①Ia hanya perlu dilaksanakan sekali. Jika pelayar dimuatkan, fungsi itu hanya perlu dilaksanakan sekali dan tidak akan dilaksanakan kemudian.

3. Fungsi penutupan
3.1 Penerangan

Andaikan fungsi A mengisytiharkan fungsi B di dalam, fungsi B merujuk kepada pembolehubah di luar fungsi B, dan nilai pulangan fungsi A ialah rujukan kepada fungsi B. Kemudian fungsi B ialah fungsi penutupan.

3.2 Contoh

3.2.1 Contoh 1: Rujukan global dan rujukan tempatan

function funA() {
  var i = 0;
  function funB() { //闭包函数funB
    i++;
    alert(i)
  }
  return funB;
}
var allShowA = funA(); //全局变量引用:累加输出1,2,3,4等
 
function partShowA() {
  var showa = funA();//局部变量引用:只输出1
  showa();
}

allShowA ialah pembolehubah global yang merujuk fungsi funA. Menjalankan allShowA() berulang kali akan mengeluarkan nilai terkumpul 1, 2, 3, 4, dsb.

Laksanakan fungsi partShowA(), kerana hanya pembolehubah tempatan showa diisytiharkan secara dalaman untuk rujukan funA Selepas pelaksanaan, disebabkan skop, sumber yang diduduki oleh showa dikeluarkan.

Kunci penutupan ialah skop: sumber yang diduduki oleh pembolehubah global hanya akan dikeluarkan apabila halaman berubah atau penyemak imbas ditutup. Apabila var allShowA = funA(), ia bersamaan dengan allShowA merujuk funB(), supaya sumber dalam funB() tidak akan dikitar semula oleh GC, jadi sumber dalam funA() juga tidak akan dikitar semula.

3.2.2 Contoh 2: Fungsi penutupan parametrik

function funA(arg1,arg2) {
  var i = 0;
  function funB(step) {
    i = i + step;
    alert(i)
  }
  return funB;
}
var allShowA = funA(2, 3); //调用的是funA arg1=2,arg2=3
allShowA(1);//调用的是funB step=1,输出 1
allShowA(3);//调用的是funB setp=3,输出 4

3.2.3 Contoh 3: Perkongsian pembolehubah dalam fungsi induk funA

function funA() {
  var i = 0;
  function funB() {
    i++;
    alert(i)
  }
  allShowC = function () {// allShowC引用匿名函数,与funB共享变量i
    i++;
    alert(i)
  }
  return funB;
}
var allShowA = funA();
var allShowB = funA();//allShowB引用了funA,allShowC在内部重新进行了绑定,与allShowB共享变量i

3.3 Senario Berkenaan

① Pastikan keselamatan pembolehubah di dalam fungsi funA, kerana pembolehubah funA tidak boleh diakses terus dari luar.

Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu kajian semua orang.

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