Friday, November 15, 2024
HomeLập Trình JavaScriptObject references và copying | Lập trình JavaScript

Object references và copying | Lập trình JavaScript

Giới thiệu

References hay còn gọi là tham chiếu và copy gọi là sao chép. Trong JavaScript, có sự khác biệt quan trọng giữa Object và Primitive về cách chúng được tham chiếu và sao chép giá trị:

Primitive: Khi bạn gán một biến primitive cho một biến khác, giá trị của nó được sao chép. Điều này có nghĩa là hai biến hoàn toàn độc lập với nhau.

let a = 10;
let b = a; // b là một bản sao của a
b = 20;
console.log(a); // 10
console.log(b); // 20

Object: Khi bạn gán một biến object cho một biến khác, cả hai biến đều tham chiếu đến cùng một đối tượng trong bộ nhớ. Điều này có nghĩa là thay đổi trên một biến sẽ ảnh hưởng đến biến kia.

let obj1 = { name: "Alice" };
let obj2 = obj1; // obj2 tham chiếu đến cùng một đối tượng với obj1
obj2.name = "Bob";
console.log(obj1.name); // Bob
console.log(obj2.name); // Bob

So sánh trong References

Cả hai object bằng nhau về giá trị và kiểu khi chúng chùng tham chiếu đến một đối tượng. Ví dụ

let a = { name: "nguyen minh chau" };
let b = a;

if (a == b) {
  console.log("a và b bằng nhau");
}
if (a === b) {
  console.log("a và b cùng kiểu nhau là kiểu: " + typeof a);
}

Kêt quả:

a  b bằng nhau
a  b cùng kiểu nhau  kiểu: object

Nhưng nếu bạn gán hai giá trị riêng cho mỗi object thì chúng sẽ không bằng nhau cho dù object là giống nhau về hình thức

let a = { name: "nguyen minh chau" };
let b = { name: "nguyen minh chau" };

if (a == b) {
} else {
  console.log("a và b khác nhau");
}
if (a === b) {
} else {
  console.log("a và b không cùng kiểu nhau");
}

Kết quả:

a  b khác nhau
a  b không cùng kiểu nhau

Const objects có thể chỉnh sửa giá trị thuộc tính

const student = {
  name: "nguyen minh chau",
  major: "software development",
};

// Tôi có thể thay đổi giá trị của properties tại đây
student.major = "sales";

for (let prop in student) {
  console.log(student[prop]);
}
nguyen minh chau
sales

Vì sao ? bởi vì bạn đang thay đổi các props bên trong của object mà không phải thay đổi cả object nên const object vẫn không báo lỗi

const student = {
  name: "nguyen minh chau",
  major: "software development",
};

// báo lỗi
student = {}; // không thể thay đổi giá trị của một const

Nhân bản và hợp nhất (Cloning and merging) Object.assign

Chúng ta có thể nhân bản một object bằng một vòng lặp

const student = {
  name: "nguyen minh chau",
  major: "software development",
};

let cloneStudent = {};

for (let prop in student) {
  cloneStudent[prop] = student[prop];
}
// Bây giờ ta đã có một student được nhân bản
console.log(cloneStudent);
{ name: 'nguyen minh chau', major: 'software development' }

dùng Object.assign để nhân bản

let a = { value: 1 };
let b = {};
Object.assign(b, a);
console.log(b); // { value: 1 }

Nhân bản lồng nhau (Nested cloning)

let apple = {
  color: "red",
  order: {
    price: "$5",
    quantity: 3,
  },
};

// nhân bản
let clone = Object.assign({}, apple);
console.log(clone.order.price); // $5

// Thay đổi
clone.order.quantity = 10;

console.log(apple); //{ color: 'red', order: { price: '$5', quantity: 10 } }

Nhân bản cấu trúc (structuredClone)

Nguyễn Minh Châu
Nguyễn Minh Châuhttps://nhatkydev.com
Hi guys ! I'm a software developer. I love programming and new technologies. I create non-professional content on this website, you can only view it for reference purposes.
RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular