penutupan JavaScript
Apakah penutupan
Penutupan, penjelasan rasmi penutupan ialah: satu yang mempunyai banyak pembolehubah dan mengikat pembolehubah ini Ungkapan bagi persekitaran (biasanya fungsi), jadi pembolehubah ini adalah sebahagian daripada ungkapan. Ciri-ciri penutupan:
1. Sebagai rujukan kepada pembolehubah fungsi, ia diaktifkan apabila fungsi itu kembali.
2. Penutupan ialah kawasan tindanan yang tidak melepaskan sumber apabila fungsi kembali.
Ringkasnya, Javascript membenarkan penggunaan fungsi dalaman---iaitu, definisi fungsi dan ungkapan fungsi terletak dalam badan fungsi fungsi lain. Tambahan pula, fungsi dalaman ini mempunyai akses kepada semua pembolehubah tempatan, parameter dan fungsi dalaman lain yang diisytiharkan dalam fungsi luar di mana ia wujud. Penutupan terbentuk apabila salah satu fungsi dalaman sedemikian dipanggil di luar fungsi luar yang mengandunginya.
Beberapa cara untuk menulis dan menggunakan penutup
Cara pertama untuk menulis
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script type="text/javascript">
function Circle(r) {
this.r = r;
}
Circle.PI = 3.14159;
Circle.prototype.area = function() {
return Circle.PI * this.r * this.r;
}
var c = new Circle(1.0);
alert(c.area());
</script>
</head>
<body>
</body>
</html>Tiada apa-apa yang istimewa tentang cara penulisan ini, ia hanya menambah beberapa atribut pada fungsi.
Cara penulisan kedua
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script type="text/javascript">
var Circle = function() {
var obj = new Object();
obj.PI = 3.14159;
obj.area = function( r ) {
return this.PI * r * r;
}
return obj;
}
var c = new Circle();
alert( c.area( 1.0 ) );
</script>
</head>
<body>
</body>
</html>Cara penulisan ini adalah untuk mengisytiharkan pembolehubah dan menetapkan fungsi sebagai nilai kepada pembolehubah.
Cara penulisan ketiga
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script type="text/javascript">
var Circle = new Object();
Circle.PI = 3.14159;
Circle.Area = function( r ) {
return this.PI * r * r;
}
alert( Circle.Area( 1.0 ) );
</script>
</head>
<body>
</body>
</html>Kaedah ini paling mudah difahami, iaitu mencipta objek baharu, dan kemudian menambah atribut dan kaedah.
Cara penulisan keempat
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script type="text/javascript">
var Circle={
"PI":3.14159,
"area":function(r){
return this.PI * r * r;
}
};
alert( Circle.area(1.0) );
</script>
</head>
<body>
</body>
</html>Kaedah ini biasa digunakan dan paling mudah. var obj = {} adalah untuk mengisytiharkan objek kosong
Tujuan penutupan Javascript
Malah, dengan menggunakan penutupan, kita boleh melakukan banyak perkara. Sebagai contoh, ia boleh mensimulasikan gaya pengekodan berorientasikan objek dalam beberapa aspek;
1. Fungsi laksana sendiri tanpa nama
2. Cache hasil
3
4. Kelas pelaksanaan dan warisan
Fungsi terbina dalam JavaScript
Semua fungsi boleh mengakses pembolehubah global.
Malah, dalam JavaScript, semua fungsi mempunyai akses kepada skop di atasnya.
JavaScript menyokong fungsi bersarang. Fungsi bersarang boleh mengakses pembolehubah fungsi peringkat atas.
Dalam contoh ini, fungsi tertanam plus() boleh mengakses pembolehubah pembilang fungsi induk:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo">0</p>
<script>
document.getElementById("demo").innerHTML = add();
function add() {
var counter = 0;
function plus() {counter += 1;}
plus();
return counter;
}
</script>
</body>
</html>Jika kita boleh mengakses tambah secara luaran (), ini boleh menyelesaikan dilema kaunter.
Kita juga perlu memastikan bahawa kaunter = 0 hanya dilaksanakan sekali.
Penutupan diperlukan di sini.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<button type="button" onclick="myFunction()">计数!</button>
<p id="demo">0</p>
<script>
var add = (function () {
var counter = 0;
return function () {return counter += 1;}
})();
function myFunction(){
document.getElementById("demo").innerHTML = add();
}
</script>
</body>
</html>Analisis kejadian
Tambah pembolehubah menentukan nilai perkataan pulangan bagi panggilan kendiri fungsi.
Fungsi panggilan kendiri hanya dilaksanakan sekali. Tetapkan pembilang kepada 0. dan mengembalikan ungkapan fungsi.
tambah pembolehubah boleh digunakan sebagai fungsi. Bahagian yang menarik ialah ia memberikan akses kepada pembilang dari skop di atas fungsi.
Ini dipanggil penutupan JavaScript. Ia membolehkan fungsi mempunyai pembolehubah persendirian.
Kaunter dilindungi oleh skop fungsi tanpa nama dan hanya boleh diubah suai melalui kaedah tambah.
Penutupan ialah fungsi yang boleh mengakses pembolehubah dalam skop fungsi peringkat atas, walaupun jika fungsi peringkat atas telah ditutup.
![Projek hadapan-Shangyou [amalan komprehensif teknologi HTML/CSS/JS]](https://img.php.cn/upload/course/000/000/068/63bfcb2974f91471.jpg)
![Kursus front-end berasaskan sifar [pembelajaran lanjutan Vue dan aplikasi praktikal]](https://img.php.cn/upload/course/000/000/068/63bbd15353895588.jpg)
![Tutorial bahagian hadapan WEB [HTML5+CSS3+JS]](https://img.php.cn/upload/course/000/000/068/63ba60c8da520536.jpg)
![Aplikasi praktikal Apipost [api, antara muka, ujian automatik, olok-olok]](https://img.php.cn/upload/course/000/000/068/63b3c967a20f4861.jpg)
