- vừa được xem lúc

[Javascript] Truyền tham trị và truyền tham chiếu

0 0 10

Người đăng: MrK

Theo Viblo Asia

Trong bài đăng này, chúng ta sẽ xem xét truyền tham trị và truyền tham chiếu trong Javascript.

Truyền tham trị

Hàm được gọi bằng cách truyền trực tiếp giá trị của biến làm đối số. Thay đổi đối số bên trong hàm không ảnh hưởng đến biến được truyền từ bên ngoài hàm. Javascript luôn luôn truyền tham trị và không bao giờ thay đổi giá trị với kiểu dữ liệu nguyên thủy (String, number hoặc boolen)

function callByValue(varOne, varTwo) { console.log("Inside Call by Value Method"); varOne = 100; varTwo = 200; console.log("varOne =" + varOne +"varTwo =" +varTwo); } let varOne = 10; let varTwo = 20; console.log("Before Call by Value Method"); console.log("varOne =" + varOne +"varTwo =" +varTwo); callByValue(varOne, varTwo) console.log("After Call by Value Method"); console.log("varOne =" + varOne +"varTwo =" +varTwo); output will be : --------------- Before Call by Value Method varOne =10 varTwo =20 Inside Call by Value Method varOne =100 varTwo =200 After Call by Value Method varOne =10 varTwo =20

Tuy nhiên, khi một biến tham chiếu đến một đối tượng bao gồm mảng, giá trị là tham chiếu đến đối tượng.

Truyền tham chiếu

Hàm được gọi bằng cách chuyển trực tiếp tham chiếu / địa chỉ của biến làm đối số. Thay đổi đối số bên trong hàm ảnh hưởng đến biến được truyền từ bên ngoài hàm. Trong các đối tượng Javascript và mảng theo sau thông qua tham chiếu.

function callByReference(varObj) { console.log("Inside Call by Reference Method"); varObj.a = 100; console.log(varObj); } let varObj = {a:1};
console.log("Before Call by Reference Method"); console.log(varObj);
callByReference(varObj) console.log("After Call by Reference Method"); console.log(varObj);
output will be : --------------- Before Call by Reference Method {a: 1} Inside Call by Reference Method {a: 100} After Call by Reference Method {a: 100}

Vì vậy, nếu chúng ta truyền đối tượng hoặc mảng làm đối số cho phương thức, thì các giá trị của đối tượng có thể thay đổi.

Chuyển đổi từ tham chiếu sang tham trị

Thường thì với những object đơn giản một cấp thế này, bạn có thể sử dụng Object.assign. Ví dụ như

let x1 = {'name': 'John'};
let x2 = Object.assign({}, x1);
x2['name'] = 'Peter'; console.log(x2);
=> {name: 'Peter'}
console.log(x1);
=> {name: 'John'}

Tuy nhiên, nếu gán object phức tạp hơn thì Object.assign không thể như mong muốn được. Ví dụ như

let x1 = { 'odd': [1, 3, 5], 'even': [0, 2, 4]
} let x2 = Object.assign({}, x1);
x2['odd'].push(7); console.log(x1);
=>
{ 'odd': [1, 3, 5, 7], 'even': [0, 2, 4]
}

=> Giải pháp

Đơn giản nhất bạn có thể biến đổi object phức tạp đó sang string(kiểu dữ liệu nguyên thủy), sau đó parse lại để chuyển string đó thành object JSON hoàn toàn mới.

let x1 = { 'odd': [1, 3, 5], 'even': [0, 2, 4]
} let x2 = JSON.parse(JSON.stringify(x1));

Kết Luận

Trên đây là một số thông tin mà mình mong muốn các bạn đọc xong có thể nắm được cơ bản hoạt động về các kiểu giá trị truyền/nhận trong javascript, có góp ý vui lòng comment. Chân thành cảm ơn!

Bình luận

Bài viết tương tự

- vừa được xem lúc

Giới thiệu Typescript - Sự khác nhau giữa Typescript và Javascript

Typescript là gì. TypeScript là một ngôn ngữ giúp cung cấp quy mô lớn hơn so với JavaScript.

0 0 502

- vừa được xem lúc

Cài đặt WSL / WSL2 trên Windows 10 để code như trên Ubuntu

Sau vài ba năm mình chuyển qua code trên Ubuntu thì thật không thể phủ nhận rằng mình đã yêu em nó. Cá nhân mình sử dụng Ubuntu để code web thì thật là tuyệt vời.

0 0 378

- vừa được xem lúc

Đặt tên commit message sao cho "tình nghĩa anh em chắc chắn bền lâu"????

. Lời mở đầu. .

1 1 702

- vừa được xem lúc

Tìm hiểu về Resource Controller trong Laravel

Giới thiệu. Trong laravel, việc sử dụng các route post, get, group để gọi đến 1 action của Controller đã là quá quen đối với các bạn sử dụng framework này.

0 0 336

- vừa được xem lúc

Phân quyền đơn giản với package Laravel permission

Như các bạn đã biết, phân quyền trong một ứng dụng là một phần không thể thiếu trong việc phát triển phần mềm, dù đó là ứng dụng web hay là mobile. Vậy nên, hôm nay mình sẽ giới thiệu một package có thể giúp các bạn phân quyền nhanh và đơn giản trong một website được viết bằng PHP với framework là L

0 0 424

- vừa được xem lúc

Bạn đã biết các tips này khi làm việc với chuỗi trong JavaScript chưa ?

Hi xin chào các bạn, tiếp tục chuỗi chủ đề về cái thằng JavaScript này, hôm nay mình sẽ giới thiệu cho các bạn một số thủ thuật hay ho khi làm việc với chuỗi trong JavaScript có thể bạn đã hoặc chưa từng dùng. Cụ thể như nào thì hãy cùng mình tìm hiểu trong bài viết này nhé (go).

0 0 415