HomeLập trìnhJavaScriptCách nắm bắt...

Cách nắm bắt tham chiếu so với giá trị trong JavaScript


của Marina Ferreira

LqCFaqsUE0xYWy99mdVstn722rdgQ3KrEQLE

Bài viết này thảo luận về cách các loại dữ liệu JavaScript khác nhau hoạt động khi chúng được gán cho một biến. Tùy thuộc vào loại dữ liệu, bộ nhớ được phân bổ khác nhau để lưu trữ nó. Nó có thể dành một không gian mới để lưu trữ một bản sao của giá trị hoặc nó có thể không tạo một bản sao nào cả và chỉ trỏ đến giá trị hiện có (tham chiếu).

Dưới đây là những ghi chú của tôi khi theo dõi khóa học Javascript30 của Wes Bos.

Số, Chuỗi và Booleans

Trong JavaScript, các loại nguyên thủy như undefined, null, string, number, booleansymbol được truyền theo giá trị.

let name = ‘Marina’;let name2 = name;
console.log({name, name2}); >> { name: ‘Marina’, name2: ‘Marina’ }
name = ‘Vinicius’;
console.log({name, name2});>> { name: ‘Vinicius’, name2: ‘Marina’ }
WOKvO0CDlVUun7pqwGOyN4g64IqolhrWjuA0
Thông qua giá trị.

Khi biến name được gán, một khoảng trống trong bộ nhớ với địa chỉ là 0x001 được dành riêng để lưu trữ giá trị đó. biến name sau đó trỏ đến địa chỉ đó. biến name2 sau đó được đặt bằng name. Một không gian mới trong bộ nhớ, với một địa chỉ mới 0x002 được phân bổ và lưu trữ một bản sao của giá trị được lưu trữ trong địa chỉ name chỉ tới.

Vì vậy, bất cứ khi nào chúng tôi muốn sửa đổi giá trị của namegiá trị được lưu trữ bởi name2 sẽ không bị thay đổi, vì nó là một bản sao, được lưu trữ ở một vị trí khác.

Đọc thêm  Hướng dẫn SVG + JavaScript – Cách viết mã cho đồng hồ hoạt hình

Đối tượng và Mảng

Các đối tượng trong JavaScript được truyền theo tham chiếu. Khi có nhiều hơn một biến được đặt để lưu trữ một object, array hoặc functioncác biến đó sẽ trỏ đến cùng một không gian được phân bổ trong bộ nhớ.

const animals = ['Cat', 'Dog', 'Horse', 'Snake'];
let animals2 = animals;console.log({animals, animals2});>>{  animals: ['Cat', 'Dog', 'Horse', 'Snake'],  animals2: ['Cat', 'Dog', 'Horse', 'Snake']}
animals2[3] = 'Wale';console.log(animals, animals2);>>{  animals: ['Cat', 'Dog', 'Horse', 'Wale'],  animals2: ['Cat', 'Dog', 'Horse', 'Wale']}
8UmMLgC2-3bI2PYI8km77Jk9P1EPUV5CdGk6
Thông qua tham khảo.

Khi nào animals được đặt để lưu trữ một mảng, bộ nhớ được cấp phát và một địa chỉ được liên kết với biến đó. sau đó animals2 được đặt bằng animals. Từ animals lưu trữ một mảng, thay vì tạo một bản sao của mảng đó và một địa chỉ mới trong bộ nhớ, animals2 chỉ đơn giản là trỏ đến cùng một đối tượng trong địa chỉ hiện có. Bằng cách đó, bất kỳ thay đổi nào được thực hiện đối với animals2 sẽ phản ánh về animalsbởi vì chúng trỏ đến cùng một vị trí.

Bạn sẽ thấy hành vi tương tự đối với các đối tượng:

const person = {  name: 'Marina',  age: 29};
let femme = person;femme.age = 18;
console.log({person, femme});>>{  person: { name: 'Marina', age: 18 },  femme: { name: 'Marina', age: 18 }}

Sao chép đối tượng và mảng

Vì một nhiệm vụ đơn giản là không đủ để tạo ra một bản sao của một đối tượng, nên có thể đạt được điều đó bằng các phương pháp khác:

Đọc thêm  JavaScript JavaScript

Mảng

lát cắt()

let animals2 = animals.slice();animals2[3] = 'Shark';

concat()

let animals3 = [].concat(animals);animals3[3] = 'Tiger';

lây lan (ES6)

let animals4 = [...animals];animals4[3] = 'Lion';

Các thay đổi sẽ chỉ ảnh hưởng đến đối tượng được sửa đổi:

console.log({animals, animals2, animals3, animals4});>>{  animals: ['Cat', 'Dog', 'Horse', 'Snake'],  animals2: ['Cat', 'Dog', 'Horse', 'Shark'],  animals3: ['Cat', 'Dog', 'Horse', 'Tiger'],  animals4: ['Cat', 'Dog', 'Horse', 'Lion']}

Các đối tượng

giao phó()

let human = Object.assign({}, person, { age: 20 });
console.log(person, human);>>{  person: { name: 'Marina', age: 29 },  human: { name: 'Marina', age: 20 }}

bản sao sâu

Điều quan trọng cần lưu ý là những phương pháp đó chỉ sâu một cấp độ. Đối với các bản sao sâu, có một phương pháp được tán thành. Sử dụng cẩn thận.

let femme3 = JSON.parse(JSON.stringify(person));femme3.name="Leslie";
console.log(person, femme3);>>{  person: { name: 'Marina', age: 29 },  femme3: { name: 'Leslie', age: 29 }}

Người giới thiệu

  • WesBos – Javascript 30
  • Bạn không biết JS: Phạm vi & Đóng cửa của Kyle Simpson

Được xuất bản lần đầu tại marina-ferreira.github.io.



Zik.vn – Biên dịch & Biên soạn Lại

spot_img

Create a website from scratch

Just drag and drop elements in a page to get started with Newspaper Theme.

Buy Now ⟶

Bài viết liên quang

DMCA.com Protection Status