Tóm tắt: & NBSP; Hướng dẫn này giải thích cách thức hoạt động của JavaScript Pass-By-Value và cung cấp cho bạn một số ví dụ về việc truyền các giá trị nguyên thủy và tham chiếu cho một hàm.: this tutorial explains how JavaScript pass-by-value works and gives you some examples of passing primitive and reference values to a function.
Trước khi đi về phía trước với hướng dẫn này, bạn nên có kiến thức tốt về các giá trị nguyên thủy và tham chiếu, và sự khác biệt giữa chúng.
JavaScript Pass-By-Value hoặc Pass-Ttef
Trong JavaScript, tất cả các đối số hàm luôn được truyền bởi giá trị. Nó có nghĩa là & nbsp; javascript sao chép các giá trị của các biến vào các đối số hàm.
Bất kỳ thay đổi nào bạn thực hiện đối với các đối số bên trong hàm không phản ánh các biến vượt qua bên ngoài hàm. Nói cách khác, những thay đổi được thực hiện đối với các đối số không được phản ánh bên ngoài hàm.
Nếu các đối số chức năng được truyền bằng tham chiếu, các thay đổi của các biến mà bạn chuyển vào hàm sẽ được phản ánh bên ngoài hàm. Điều này là không thể trong JavaScript.
Qua giá trị của các giá trị nguyên thủy
Hãy cùng xem một ví dụ sau.
Code language: JavaScript [javascript]
function square[x] { x = x * x; return x; } let y = 10; let result = square[y]; console.log[result]; // 100 console.log[y]; // 10 -- no change
Cách tập lệnh hoạt động.
Đầu tiên, xác định hàm square[]
chấp nhận đối số x
. Hàm gán bình phương của x
cho đối số x
.x
. The function assigns the square of x
to the x
argument.
Tiếp theo, khai báo biến y
và khởi tạo giá trị của nó thành 10
:y
and initialize its value to 10
:
Sau đó, chuyển biến y
& nbsp; vào hàm square[]
. Khi chuyển biến ________ 8 & nbsp; cho hàm square[]
, JavaScript sao chép ________ 8 & nbsp; giá trị cho biến x
.
Sau đó, hàm square[]
thay đổi biến x
. Tuy nhiên, nó không ảnh hưởng đến giá trị của biến y
vì x
và y
là các biến riêng biệt.x
variable. However, it does not impact the value of the y
variable because x
and y
are separate variables.
Cuối cùng, & nbsp; giá trị của biến y
không thay đổi sau khi hàm square[]
hoàn thành.
Nếu JavaScript đã sử dụng & nbsp; từng tham chiếu, biến ________ 8 & nbsp; sẽ thay đổi thành
4 sau khi gọi hàm.Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Qua giá trị của & nbsp; giá trị tham chiếu
Nó không rõ ràng để thấy rằng các giá trị tham chiếu cũng được truyền bởi các giá trị. Ví dụ:
Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; } increaseAge[person]; console.log[person];
Kịch bản hoạt động như thế nào:
Đầu tiên, xác định biến
5 tham chiếu một đối tượng có hai thuộc tínhCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
6 vàCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
7:Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Tiếp theo, xác định hàm
8 chấp nhận một đối tượngCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
9 và tăng thuộc tínhCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
7 của đối sốCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
9 lên một.Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Sau đó, chuyển đối tượng
5 cho hàmCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
8:
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Code language: JavaScript [javascript]
Trong nội bộ, công cụ JavaScript tạo tham chiếu
9 và làm cho tham chiếu biến này cùng một đối tượng mà các tham chiếu biếnCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
5.Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Sau đó, tăng thuộc tính
7 lên một bên trong hàmCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
8 thông qua biếnCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
9Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Cuối cùng, truy cập đối tượng thông qua tham chiếu
5:Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Có vẻ như JavaScript chuyển một đối tượng bằng cách tham chiếu vì sự thay đổi đối với đối tượng được phản ánh bên ngoài hàm. Tuy nhiên, & nbsp; đây không phải là trường hợp.
Trong thực tế, khi chuyển một đối tượng cho một hàm, bạn đang chuyển tham chiếu của đối tượng đó chứ không phải đối tượng thực tế. Do đó, hàm có thể sửa đổi các thuộc tính của đối tượng thông qua tham chiếu của nó.
Tuy nhiên, bạn không thể thay đổi tham chiếu được truyền vào hàm. Ví dụ:
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Code language: JavaScript [javascript]
Output:
Code language: CSS [css]
{ name: 'John', age: 26 }
Trong ví dụ này, hàm square[]
0 thay đổi thuộc tính
7 thông qua đối sốCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
9:Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
và làm cho tham chiếu
9 Một đối tượng khác:Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Tuy nhiên, tham chiếu
5 vẫn đề cập đến đối tượng gốc có thuộc tínhCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
7 thay đổi thànhCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
square[]
6. Nói cách khác, hàm 8 không thay đổi tham chiếuCode language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
5.Code language: JavaScript [javascript]
let person = { name: 'John', age: 25, }; function increaseAge[obj] { obj.age += 1; // reference another object obj = { name: 'Jane', age: 22 }; } increaseAge[person]; console.log[person];
Nếu khái niệm này vẫn làm bạn bối rối, bạn có thể coi các đối số chức năng là các biến cục bộ.
Bản tóm tắt
- JavaScript chuyển tất cả các đối số cho một hàm theo các giá trị.
- Đối số chức năng là các biến cục bộ trong JavaScript.
Hướng dẫn này có hữu ích không?