Salah faham penggunaan JavaScript


Dalam bab ini kita akan membincangkan salah faham dalam penggunaan JavaScript.

Ralat aplikasi pengendali tugasan

Dalam program JavaScript, jika anda menggunakan tanda sama (=) pengendali tugasan dalam pernyataan bersyarat if, hasil yang salah akan dihasilkan, betulkan Kaedahnya ialah menggunakan dua tanda yang sama bagi pengendali perbandingan (==).

jika Pernyataan bersyarat mengembalikan salah (yang kami jangkakan) kerana x tidak sama dengan 10:

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 0;
document.getElementById("demo").innerHTML = Boolean(x == 10);
</script>

</body>
</html>

Jalankan contoh»

Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

jika Kenyataan bersyarat mengembalikanbenar (bukan seperti yang kami jangkakan) kerana pernyataan bersyarat dilaksanakan dan x diberikan nilai 10, 10 adalah benar:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 0;
document.getElementById("demo").innerHTML = Boolean(x = 10);
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

jika Pernyataan bersyarat mengembalikan salah (bukan seperti yang kami jangkakan) Kerana pernyataan bersyarat dilaksanakan, x diberikan nilai 0 dan 0 adalah palsu:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 0;
document.getElementById("demo").innerHTML = Boolean(x = 0);
</script>

</body>
</html>

Jalankan instance»

Klik butang" Run Instance" untuk melihat contoh dalam talian

Note赋值语句返回变量的值。

Ralat biasa operator perbandingan

Dalam perbandingan biasa, jenis data diabaikan yang berikut jika pernyataan bersyarat kembali benar:

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 10;
var y = "10";
document.getElementById("demo").innerHTML = Boolean(x == y);
</script>

</body>
</html>
<. 🎜>

Jalankan contoh»Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Dalam operasi perbandingan yang ketat, === ialah Kalkulator identiti, semasa menyemak nilai dan jenis ungkapan, yang berikut jika pernyataan bersyarat mengembalikan palsu:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 10;
var y = "10";
document.getElementById("demo").innerHTML = Boolean(x === y);
</script>

</body>
</html>

Jalankan instance» Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

Ralat jenis ini sering berlaku dalam pernyataan suis Pernyataan suis menggunakan pengendali identiti (===) sebagai perbandingan:

Kejadian berikut akan melaksanakan tetingkap timbul amaran:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 10;
switch(x) {
    case 10: alert("Hello");
}
</script>

</body>
</html>

Jalankan instance»Klik butang "Jalankan contoh" untuk melihat kejadian dalam talian

Kejadian berikut tidak akan melaksanakan tetingkap timbul amaran kerana jenis tidak konsisten:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 10;
switch(x) {
    case "10": alert("Hello");
}
</script>

</body>
</html>

Jalankan contoh»Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Nota tambahan dan sambungan

Tambahan ialah penambahan dua nombor.

Penggabungan ialah gabungan dua rentetan.

JavaScript menggunakan operator + untuk kedua-dua penambahan dan penggabungan.

Seterusnya kita boleh melihat perbezaan antara menambah dua nombor dan menggabungkan nombor dan rentetan melalui contoh:

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 10 + "5";
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Jalankan Instance»Klik butang "Run Instance" untuk melihat contoh dalam talian

Hasil penambahan pembolehubah juga tidak konsisten:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 10;
var y = "5";
var z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Jalankan contoh»Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Nota tentang penggunaan data titik terapung Nota

Semua data dalam JavaScript disimpan dalam 64-bit

data titik terapung (terapung).

Semua bahasa pengaturcaraan, termasuk JavaScript, mengalami kesukaran untuk menentukan ketepatan data titik terapung:

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 0.1;
var y = 0.2;
var z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Jalankan Contoh»Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian

Saya menyelesaikan masalah di atas dengan menggunakan pendaraban dan pembahagian integer:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 0.1;
var y = 0.2;
var z = (x * 10 + y *10) / 10;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Jalankan instance»

Klik butang "Run instance" untuk melihat contoh dalam talian

Cawangan rentetan JavaScript

JavaScript run kita berada dalam pernyataan pemisah baris digunakan dalam rentetan:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
	"Hello World!";
</script>

</body>
</html>

Run Instance»

Klik "Run Butang Instance" untuk melihat Contoh dalam talian

Walau bagaimanapun, menggunakan carriage return dan suapan talian terus dalam rentetan akan mengakibatkan ralat:

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>about:newtab

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = "Hello 
World!";
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Kita boleh memilih alat pembangunan atau tekan F12 untuk lihat mesej ralat:

QQ截图20161017174526.png

Pemutus baris rentetan memerlukan penggunaan serik ke belakang(), seperti ditunjukkan di bawah:

Penggunaan titik bertitik yang salah

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var x = 5;
if (x == 19);{
	document.getElementById("demo").innerHTML = "Hello";
}
</script>

</body>
</html>

Jalankan instance»

Klik butang "Run instance" untuk melihat instance dalam talian

Dalam contoh berikut, disebabkan penggunaan koma bertitik yang salah , blok kod dalam pernyataan if tidak akan dilaksanakan:

Nota tentang penggunaan pernyataan Return

JavaScript secara automatik tamat pada baris terakhir kod secara lalai.

Dua contoh berikut mengembalikan hasil yang sama (satu dengan koma bertitik dan satu tanpa):

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = myFunction(55);
function myFunction(a) {
    var power = 10
    return a * power
}
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = myFunction(55);
function myFunction(a) {
    var power = 10;
    return a * power;
}
</script>

</body>
</html>

Run Contoh »

Klik butang "Run Example" untuk melihat contoh dalam talian

JavaScript juga boleh menggunakan berbilang baris untuk menamatkan pernyataan. Butang " Jalankan Instance" untuk melihat contoh dalam talian

Walau bagaimanapun, hasil contoh berikut akan kembali
tidak ditentukan

:

Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = myFunction(55);
function myFunction(a) {
    var
    power = 10;
    return a * power;
}
</script>

</body>
</html>

Jalankan contoh»

Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Kenapa ada keputusan sedemikian? Kerana dalam JavaScript, kod Contoh 4 adalah konsisten dengan kod berikut: 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = myFunction(55);
function myFunction(a) {
    var
    power = 10;
    return
    a * power;
}
</script>

</body>
</html>

Parse

Jika ia adalah pernyataan yang tidak lengkap, seperti berikut: 

function myFunction(a) {
    var
    power = 10;  
    return;       // 分号结束，返回 undefined
    a * power;
}

JavaScript akan Cuba membaca baris kedua pernyataan: 

var

Tetapi oleh kerana pernyataan itu lengkap seperti ini: 

power = 10;

JavaScript akan menutup pernyataan secara automatik: 

return

Dalam JavaScript, pecahkan nombor adalah pilihan.

Memandangkan pemulangan ialah penyata yang lengkap, JavaScript akan menutup penyata pemulangan.

Note注意：不用对 return 语句进行断行。

Menggunakan nama untuk mengindeks ke dalam tatasusunan

Banyak bahasa pengaturcaraan membenarkan penggunaan nama sebagai indeks ke dalam tatasusunan.

Suatu tatasusunan yang menggunakan nama sebagai indeks dipanggil tatasusunan bersekutu (atau cincang).

JavaScript tidak menyokong penggunaan nama untuk mengindeks tatasusunan, hanya indeks angka dibenarkan.

Instance

return;

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Dalam JavaScript, objek menggunakan nama sebagai indeks.

Jika anda menggunakan nama sebagai indeks, JavaScript akan mentakrifkan semula tatasusunan sebagai objek standard apabila mengaksesnya.

Selepas melaksanakan operasi ini, kaedah dan sifat tatasusunan tidak lagi boleh digunakan, jika tidak, ralat akan berlaku:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo"></p>
<script>
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46; 
document.getElementById("demo").innerHTML =
	person[0] + " " + person.length;
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Tentukan elemen tatasusunan dan anda tidak boleh menambah koma pada penghujung

Cara takrifan yang salah :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>
如果你使用名字作为索引，当访问数组时，JavaScript 会把数组重新定义为标准对象，数组的方法及属性将不能再使用，否则会产生错误:。
</p>
<p id="demo"></p>
<script>
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46; 
document.getElementById("demo").innerHTML =
	person[0] + " " + person.length;
</script>

</body>
</html>

Cara takrifan yang betul:

points = [40, 100, 1, 5, 25, 10,];

Tentukan objek, dan anda tidak boleh menambah koma di hujungnya

Cara takrifan yang salah:

points = [40, 100, 1, 5, 25, 10];

Takrifan Betul: 

websites = {site:"php中文网", url:"www.php.cn", like:460,}

Undefined bukan Null

dalam JavaScript, null digunakan untuk objek, undefined digunakan untuk pembolehubah, sifat dan kaedah.

Objek mungkin batal hanya jika ia ditakrifkan, jika tidak ia tidak ditentukan.

Jika kita ingin menguji sama ada objek itu wujud, ralat akan dilemparkan jika objek itu belum ditakrifkan lagi.

Penggunaan yang salah: 

websites = {site:"php中文网", url:"www.php.cn", like:460}

Cara yang betul ialah kita perlu menggunakan typeof terlebih dahulu untuk mengesan sama ada objek ditakrifkan: 

if (myObj !== null && typeof myObj !== "undefined")

Skop blok program

JavaScript tidak mencipta skop baharu dalam setiap blok kod Secara amnya, skop setiap blok kod adalah global.

Pembolehubah i dalam kod berikut mengembalikan 10 dan bukannya tidak ditentukan:

Instance

if (typeof myObj !== "undefined" && myObj !== null)

Jalankan instance»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian


←
→