Rumah > hujung hadapan web > tutorial js > Hanya lembaran cheat Javascript yang anda perlukan!

Hanya lembaran cheat Javascript yang anda perlukan!

Barbara Streisand
Lepaskan: 2024-12-24 08:20:20
asal
554 orang telah melayarinya

Only Javascript cheatsheet you need !

Perbezaan Antara var, let, dan const

1. Gambaran keseluruhan var, let dan const

Feature var let const
Scope Function-scoped Block-scoped Block-scoped
Re-declaration Allowed within the same scope Not allowed in the same scope Not allowed in the same scope
Re-assignment Allowed Allowed Not allowed after initialization
Initialization Can be declared without initialization Can be declared without initialization Must be initialized at the time of declaration
Hoisting Hoisted but initialized to undefined Hoisted but not initialized Hoisted but not initialized
Ciri
var

biarkan const
Type Function Scope Block Scope
var Variables are scoped to the enclosing function. Does not support block scope. A var inside a block (if, for, etc.) leaks into the enclosing function or global scope.
let / const Not function-scoped. Variables are confined to the block they are declared in.
Skop Skop fungsi Skop sekatan Skop sekatan

Pengisytiharan semula

Dibenarkan dalam skop yang sama Tidak dibenarkan dalam skop yang sama Tidak dibenarkan dalam skop yang sama Tugas semula
Dibenarkan Dibenarkan Tidak dibenarkan selepas permulaan Permulaan
if (true) {
  var x = 10;
  let y = 20;
  const z = 30;
}
console.log(x); // 10 (accessible because of function scope)
console.log(y); // ReferenceError (block-scoped)
console.log(z); // ReferenceError (block-scoped)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Boleh diisytiharkan tanpa permulaan Boleh diisytiharkan tanpa permulaan Mesti dimulakan pada masa pengisytiharan
Mengangkat

Ditingkatkan tetapi dimulakan kepada tidak ditentukan Ditingkatkan tetapi tidak dimulakan Ditingkatkan tetapi tidak dimulakan
2. Perbezaan Skop
Feature var let const
Re-declaration Allowed Not allowed Not allowed
Re-assignment Allowed Allowed Not allowed
Taip Skop Fungsi Skop Sekat var Pembolehubah diskop kepada fungsi lampiran. Tidak menyokong skop blok. Var di dalam blok (jika, untuk, dll.) bocor ke dalam fungsi lampiran atau skop global. biar / const Tidak skop fungsi. Pembolehubah terhad kepada blok yang diisytiharkan. Contoh: 3. Pengisytiharan semula dan penugasan semula Ciri var biarkan const Pengisytiharan semula Dibenarkan Tidak dibenarkan Tidak dibenarkan Tugas semula Dibenarkan Dibenarkan Tidak dibenarkan

Contoh:

if (true) {
  var x = 10;
  let y = 20;
  const z = 30;
}
console.log(x); // 10 (accessible because of function scope)
console.log(y); // ReferenceError (block-scoped)
console.log(z); // ReferenceError (block-scoped)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

4. Tingkah Laku Mengangkat

Type Hoisting Behavior
var Hoisted to the top of the scope but initialized as undefined.
let Hoisted but not initialized. Accessing it before declaration causes a ReferenceError.
const Hoisted but not initialized. Must be initialized at the time of declaration.
Taip

Gelagat Mengangkat

var
Ditingkatkan ke bahagian atas skop tetapi dimulakan sebagai tidak ditentukan. biarkan
// Re-declaration
var a = 10;
var a = 20; // Allowed

let b = 30;
// let b = 40; // SyntaxError: Identifier 'b' has already been declared

const c = 50;
// const c = 60; // SyntaxError: Identifier 'c' has already been declared

// Re-assignment
a = 15; // Allowed
b = 35; // Allowed
// c = 55; // TypeError: Assignment to constant variable
Salin selepas log masuk
Salin selepas log masuk
Ditingkatkan tetapi tidak dimulakan. Mengaksesnya sebelum pengisytiharan menyebabkan ReferenceError.
konst

Ditingkatkan tetapi tidak dimulakan. Mesti dimulakan pada masa pengisytiharan. Contoh:
Feature let and const
Block Scope Both are confined to the block in which they are declared.
No Hoisting Initialization Both are hoisted but cannot be accessed before initialization.
Better Practice Preferred over var for predictable scoping.

5. Persamaan Antara let dan const

Scenario Recommended Keyword
Re-declare variables or use function scope var (generally avoid unless necessary for legacy code).
Variables that may change let (e.g., counters, flags, intermediate calculations).
Variables that should not change const (e.g., configuration settings, fixed values).
Ciri biar dan konst Skop Sekat Kedua-duanya terhad kepada blok di mana ia diisytiharkan. Tiada Permulaan Pengangkat Kedua-duanya dinaikkan tetapi tidak boleh diakses sebelum permulaan. Amalan Lebih Baik Diutamakan daripada var untuk skop yang boleh diramal. 6. Bila Nak Guna Yang Mana? Senario Kata Kunci Disyorkan Isytihar semula pembolehubah atau gunakan skop fungsi var (biasanya mengelak melainkan perlu untuk kod warisan). Pembolehubah yang mungkin berubah biarkan (cth., pembilang, bendera, pengiraan perantaraan). Pembolehubah yang tidak sepatutnya berubah const (cth., tetapan konfigurasi, nilai tetap).

7. Penjelasan Mengangkat

Apakah itu Mengangkat?

Hoisting ialah gelagat lalai JavaScript untuk memindahkan pengisytiharan ke bahagian atas skopnya semasa fasa penyusunan.

  • var: Dinaikkan dan dimulakan kepada tidak ditentukan.
  • let / const: Ditinggikan tetapi tidak dimulakan. Ini mewujudkan zon mati sementara (TDZ) dari permulaan blok sehingga pengisytiharan ditemui.

Mengapa Pengangkat Berfungsi Dengan Cara Ini?

  1. Fasa Penyusunan: JavaScript mula-mula mengimbas kod untuk mencipta ruang memori untuk pembolehubah dan pengisytiharan fungsi. Pada peringkat ini:
  • pembolehubah var dimulakan kepada tidak ditentukan.
  • pembolehubah let dan const "dinaikkan" tetapi dibiarkan tanpa dimulakan, oleh itu TDZ.
  • Pengisytiharan fungsi dinaikkan sepenuhnya.
  1. Fasa Pelaksanaan: JavaScript mula melaksanakan kod baris demi baris. Pembolehubah dan fungsi diberikan nilai semasa fasa ini.

8. Ringkasan Mengangkat

Type Hoisting Access Before Declaration
var Hoisted and initialized to undefined. Allowed but value is undefined.
let Hoisted but not initialized. Causes a ReferenceError.
const Hoisted but not initialized. Causes a ReferenceError.
Taip Mengangkat Akses Sebelum Pengisytiharan var Ditingkatkan dan dimulakan kepada tidak ditentukan. Dibenarkan tetapi nilai tidak ditentukan. biarkan Ditingkatkan tetapi tidak dimulakan. Menyebabkan ReferenceError. konst Ditingkatkan tetapi tidak dimulakan. Menyebabkan ReferenceError.

Contoh:

if (true) {
  var x = 10;
  let y = 20;
  const z = 30;
}
console.log(x); // 10 (accessible because of function scope)
console.log(y); // ReferenceError (block-scoped)
console.log(z); // ReferenceError (block-scoped)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kesimpulan

  1. Gunakan const bila boleh untuk pembolehubah yang tidak memerlukan penugasan semula.
  2. Gunakan let untuk pembolehubah yang perlu ditetapkan semula dalam skop yang sama.
  3. Elakkan var melainkan menggunakan kod warisan atau memerlukan tingkah laku skop fungsi.

Jenis Data JavaScript

JavaScript mempunyai pelbagai jenis data yang dikelaskan kepada jenis Primitif dan Bukan Primitif (Rujukan). Berikut ialah penjelasan setiap satu dengan contoh dan perbezaan:


1. Jenis Data Primitif

Jenis primitif tidak boleh diubah, bermakna nilainya tidak boleh diubah selepas ia dicipta. Ia disimpan terus dalam ingatan.

Data Type Example Description
String "hello", 'world' Represents a sequence of characters (text). Enclosed in single (''), double (""), or backticks ().
Number 42, 3.14, NaN Represents both integers and floating-point numbers. Includes NaN (Not-a-Number) and Infinity.
BigInt 123n, 9007199254740991n Used for numbers larger than Number.MAX_SAFE_INTEGER (2^53 - 1). Add n to create a BigInt.
Boolean true, false Represents logical values, used in conditions to represent "yes/no" or "on/off".
Undefined undefined Indicates a variable has been declared but not assigned a value.
Null null Represents an intentional absence of value. Often used to reset or clear a variable.
Symbol Symbol('id') Represents a unique identifier, mainly used as property keys for objects to avoid collisions.
Jenis Data Contoh Penerangan Rentetan "hello", 'dunia' Mewakili urutan aksara (teks). Dilampirkan dalam satu (''), dua kali ("") atau tanda belakang (). Nombor 42, 3.14, NaN Mewakili kedua-dua integer dan nombor titik terapung. Termasuk NaN (Bukan-Nombor) dan Infiniti. BigInt 123n, 9007199254740991n Digunakan untuk nombor yang lebih besar daripada Nombor.MAX_SAFE_INTEGER (2^53 - 1). Tambahkan n untuk mencipta BigInt. Boolean benar, salah Mewakili nilai logik, digunakan dalam keadaan untuk mewakili "ya/tidak" atau "hidup/mati". Tidak ditentukan tidak ditentukan Menunjukkan pembolehubah telah diisytiharkan tetapi tidak diberikan nilai. Batal null Mewakili ketiadaan nilai yang disengajakan. Selalunya digunakan untuk menetapkan semula atau mengosongkan pembolehubah. Simbol Simbol('id') Mewakili pengecam unik, terutamanya digunakan sebagai kunci sifat untuk objek untuk mengelakkan perlanggaran.

2. Jenis Data Bukan Primitif (Rujukan).

Jenis bukan primitif boleh berubah dan disimpan melalui rujukan. Ia digunakan untuk menyimpan koleksi data atau entiti yang lebih kompleks.

Data Type Example Description
Object {name: 'John', age: 30} A collection of key-value pairs. Keys are strings (or Symbols), and values can be any type.
Array [1, 2, 3, "apple"] A list-like ordered collection of values. Access elements via index (e.g., array[0]).
Function function greet() {} A reusable block of code that can be executed. Functions are first-class citizens in JavaScript.
Date new Date() Represents date and time. Provides methods for manipulating dates and times.
RegExp /pattern/ Represents regular expressions used for pattern matching and string searching.
Map new Map() A collection of key-value pairs where keys can be of any type, unlike plain objects.
Set new Set([1, 2, 3]) A collection of unique values, preventing duplicates.
WeakMap new WeakMap() Similar to Map, but keys are weakly held, meaning they can be garbage-collected.
WeakSet new WeakSet() Similar to Set, but holds objects weakly to prevent memory leaks.

3. Perbezaan Utama Antara Jenis Primitif dan Bukan Primitif

Aspect Primitive Types Non-Primitive Types
Mutability Immutable: Values cannot be changed. Mutable: Values can be modified.
Storage Stored directly in memory. Stored as a reference to a memory location.
Copy Behavior Copied by value (creates a new value). Copied by reference (points to the same object).
Examples string, number, boolean, etc. object, array, function, etc.

4. Kes Khas

jenis Operator

  • jenis null: Mengembalikan "objek" disebabkan oleh pepijat sejarah dalam JavaScript, tetapi null bukan objek.
  • jenis NaN: Mengembalikan "nombor", walaupun ia bermaksud "Bukan-Nombor."
  • jenis fungsi: Mengembalikan "fungsi", yang merupakan subjenis objek.

Taip Dinamik

JavaScript membenarkan pembolehubah menyimpan nilai jenis yang berbeza semasa masa jalan:

if (true) {
  var x = 10;
  let y = 20;
  const z = 30;
}
console.log(x); // 10 (accessible because of function scope)
console.log(y); // ReferenceError (block-scoped)
console.log(z); // ReferenceError (block-scoped)
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

5. Contoh untuk Setiap Jenis Data

Jenis Primitif

// Re-declaration
var a = 10;
var a = 20; // Allowed

let b = 30;
// let b = 40; // SyntaxError: Identifier 'b' has already been declared

const c = 50;
// const c = 60; // SyntaxError: Identifier 'c' has already been declared

// Re-assignment
a = 15; // Allowed
b = 35; // Allowed
// c = 55; // TypeError: Assignment to constant variable
Salin selepas log masuk
Salin selepas log masuk

Jenis Bukan Primitif

console.log(a); // undefined (hoisted)
var a = 10;

console.log(b); // ReferenceError (temporal dead zone)
let b = 20;

console.log(c); // ReferenceError (temporal dead zone)
const c = 30;
Salin selepas log masuk

6. Ringkasan jenis Keputusan

Expression Result
typeof "hello" "string"
typeof 42 "number"
typeof 123n "bigint"
typeof true "boolean"
typeof undefined "undefined"
typeof null "object"
typeof Symbol() "symbol"
typeof {} "object"
typeof [] "object"
typeof function(){} "function"
Ekspresi
Hasil jenis "hello" "rentetan" jenis 42 "nombor" jenis 123n "bigint" jenis benar "boolean" jenis tidak ditentukan "undefined" jenis null "objek" jenis Simbol() "simbol" jenis {} "objek" jenis [] "objek" jenis fungsi(){} "fungsi"

Atas ialah kandungan terperinci Hanya lembaran cheat Javascript yang anda perlukan!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan