của Marina Ferreira
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, boolean và symbol đượ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’ }
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.
Đố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']}
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:
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.
