Pengangkat pembolehubah JavaScript

Apakah keputusan program berikut?

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
var foo = 1;
function bar() {
if (!foo) {
var foo = 10;
}
alert(foo);
}
bar();
</script>
</head>
<body>
</body>
</html>

Keputusan muncul: 10

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
</script>
</head>
<body>
</body>
</html>

Keputusan muncul: 1

Kejutkan anda, betul tak? Apa yang berlaku? Ini mungkin tidak biasa, berbahaya dan mengelirukan, tetapi ia juga sebenarnya merupakan ciri bahasa JavaScript yang sangat berguna dan mengagumkan - angkat boleh ubah.

Pengamatan JavaScript tidak akan menaikkan

JavaScript hanya pembolehubah yang diisytiharkan akan Promosi , permulaan tidak akan.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var x = 5; // 初始化 x
var y = 7; // 初始化 y
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = x + " " + y;           // 显示 x 和 y
</script>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var x = 5; // 初始化 x
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = "x 为：" + x + "，y 为：" + y;           // 显示 x 和 y
var y = 7; // 初始化 y
</script>
</body>
</html>

2 Keluaran y tidak ditentukan, ini kerana pembolehubah Pengisytiharan (var y) dinaikkan, tetapi permulaan (y = 7) tidak dinaikkan, jadi pembolehubah y ialah pembolehubah tidak ditentukan.

Mengisytiharkan pembolehubah anda dalam pengepala

berfungsi untuk kebanyakan pengaturcara Tidak tahu mengenai pengangkat pembolehubah JavaScript.

Jika pengaturcara tidak memahami promosi pembolehubah dengan baik, program yang mereka tulis terdedah kepada masalah.

Untuk mengelakkan masalah ini, kami biasanya mengisytiharkan pembolehubah ini sebelum permulaan setiap skop Ini juga merupakan langkah penghuraian JavaScript biasa dan mudah untuk kami fahami.

Meneruskan pembelajaran

fail baharu

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p id="demo"></p> <script> var x = 5.5; // 初始化 x elem = document.getElementById("demo"); // 查找元素 elem.innerHTML = "x 为：" + x + "，y 为：" + y; // 显示 x 和 y var y = 7; // 初始化 y </script> </body> </html>

serahkan Tetapkan Semula Kod

Operasi automatik

Pengangkat pembolehubah JavaScript

peringkat rendahTutorial tapak web tiruan perusahaan Imperial CMS

peringkat rendahPemula dengan asas sifar dalam WordPress membina blog peribadi dan laman web korporat

peringkat rendahVideo arahan pembinaan tapak web berasaskan sifar CMS muktamad

peringkat rendahProjek hadapan-Shangyou [amalan komprehensif teknologi HTML/CSS/JS]

PertengahanVue3.0 daripada 0 untuk membina amalan projek sistem pengurusan belakang universal

peringkat rendahKursus front-end berasaskan sifar [pembelajaran lanjutan Vue dan aplikasi praktikal]

peringkat rendahTutorial bahagian hadapan WEB [HTML5+CSS3+JS]

peringkat rendahBermula dengan cepat dengan apipost

PertengahanTutorial praktikal Vue3+TypeScript amalan projek peringkat perusahaan

peringkat rendahMari kita bercakap secara ringkas tentang memulakan perniagaan dalam PHP

PertengahanProjek e-dagang VUE (pertempuran sebenar projek dua bahagian hadapan & belakang)

peringkat rendahAplikasi praktikal Apipost [api, antara muka, ujian automatik, olok-olok]