Cách thêm cặp Khóa / Giá trị vào Đối tượng trong JavaScript – thêm giá trị cho đối tượng javascript

Có nhiều cách để thêm cặp Khóa / Giá trị vào một đối tượng, cụ thể là – sử dụng ký hiệu dấu ngoặc `[]`, ví dụ: `obj [‘name’] = ‘John’`, sử dụng ký hiệu dấu chấm` .`, ví dụ: `obj.name = ‘John’ ‘.

Bạn đang xem : thêm giá trị vào đối tượng javascript

Cách thêm cặp Khóa / Giá trị vào Đối tượng trong JavaScript

Thêm khóa / Cặp giá trị cho một Đối tượng trong JavaScript #

Có nhiều cách để thêm một cặp khóa / giá trị cho một đối tượng:

  • Sử dụng ký hiệu [] trong ngoặc vuông, ví dụ: obj ['name'] = 'John' .
  • Sử dụng ký hiệu dấu chấm . , ví dụ: obj.name = 'John' .
  • Sử dụng phương thức Object.assign () , chuyển nó một đối tượng đích và nguồn dưới dạng
    tham số.

Hãy xem một ví dụ bằng 2 cách đầu tiên.

index.js

 

const

obj

=

{

name

: < / p>

'Tom'

}

;

obj

.

age

=

30

;

obj

[

'country'

]

=

'Chile'

;

giao diện điều khiển

.

log

< p class = "dấu chấm câu"> (

obj

)

;

Trước tiên, chúng tôi thêm một cặp khóa / giá trị bằng cách sử dụng ký hiệu dấu chấm . . Nó ngắn gọn hơn và
trực tiếp hơn cách tiếp cận ký hiệu [] trong ngoặc vuông.

Nếu một khóa có tên được cung cấp đã tồn tại trên đối tượng, giá trị của nó sẽ bị ghi đè.

Tuy nhiên, nếu tên của khóa trong đối tượng của bạn có khoảng trắng hoặc chứa dấu gạch ngang
- , bạn phải sử dụng phương pháp tiếp cận dấu ngoặc vuông.

index.js

 

const < / p> obj

=

{

name

:

'Tom'

}

;

obj

.

my

-

country

=

30

;

obj

[

'quốc gia của tôi'

]

=

'Chile'

;

Bạn cũng sử dụng phương pháp tiếp cận dấu ngoặc vuông khi bạn không biết tên của
trước khóa và bạn cần đặt tên cho khóa theo cách động.

index.js

 

const

obj

=

{

}

;

const

key

=

'thành phố'

;

obj

[

key

]

=

'Santiago'

;

giao diện điều khiển

.

log

< p class = "dấu chấm câu"> (

obj

)

;

Trong đoạn mã, chúng tôi có tên của khóa được lưu trữ trong một biến, do đó chúng tôi không thể sử dụng ký hiệu dấu chấm để đặt cặp khóa / giá trị trên đối tượng.

Lưu ý rằng chúng tôi không bọc giá trị giữa các dấu ngoặc vuông trong dấu ngoặc kép,
bởi vì nó là một biến, có giá trị mà chúng tôi sử dụng cho khóa.

Theo nguyên tắc chung, bạn sẽ thấy hầu hết các lập trình viên sử dụng ký hiệu dot . để thêm các cặp khóa / giá trị vào các đối tượng, trừ khi họ phải sử dụng ký hiệu cách tiếp cận [] trong dấu ngoặc vuông.

Cách phổ biến nhất tiếp theo để thêm cặp khóa / giá trị vào một đối tượng là sử dụng
Phương thức Object.assign .

Để thêm nhiều cặp khóa / giá trị vào một đối tượng trong cùng một câu lệnh, hãy sử dụng
Phương thức Object.assign () . Phương thức sao chép các cặp khóa / giá trị của một hoặc nhiều
các đối tượng vào một đối tượng đích và trả về đối tượng đích đã sửa đổi.

index.js

 

const obj

=

{

country

:

'Chile'

}

;

Đối tượng

.

gán < / p>

(

obj

,

{

color

:

'red'

,

food

:

'pizza'

}

)

;

giao diện điều khiển

.

log

< p class = "dấu chấm câu"> (

obj

)

;

Các tham số chúng tôi đã chuyển cho
Object.assign
phương thức là:

  1. đối tượng đích – đối tượng mà các thuộc tính được cung cấp sẽ là
    đã áp dụng
  2. (các) đối tượng nguồn – một hoặc nhiều đối tượng chứa các thuộc tính mà chúng tôi
    muốn áp dụng cho đối tượng đích

Một cách dễ hiểu để nghĩ về phương thức Object.assign
các cặp khóa / giá trị của đối tượng mà chúng tôi đã truyền khi tham số thứ hai được sao chép vào
đối tượng mà chúng tôi đã cung cấp làm tham số đầu tiên.

Phương thức Object.assign rất tiện lợi khi bạn phải thêm nhiều cặp khóa / giá trị vào một đối tượng.

Một cách tiếp cận phổ biến khác để thêm nhiều cặp khóa / giá trị vào một đối tượng là sử dụng
toán tử trải rộng (...) . Tuy nhiên, lưu ý rằng để sử dụng cú pháp ... , chúng tôi
khai báo biến bằng cách sử dụng từ khóa let .

index.js

 

let

obj

=

{

name

:

'Tom'

}

;

obj

=

{

...

obj

,

color

:

'xanh'

}

;

giao diện điều khiển

.

log

< p class = "dấu chấm câu"> (

obj

)

;

Một cách dễ dàng để nghĩ về
toán tử spread (…)
là chúng tôi đang giải nén các cặp khóa / giá trị của đối tượng vào một đối tượng mới.

Chúng tôi sử dụng từ khóa let thay vì const vì nó cho phép chúng tôi tuyên bố lại
biến obj .

Về cơ bản, chúng tôi tạo một đối tượng mới, sử dụng các cặp khóa / giá trị của một đối tượng hiện có
đối tượng và một số đối tượng bổ sung.

Đọc thêm #


Xem thêm những thông tin liên quan đến chủ đề thêm giá trị cho đối tượng javascript

Bài 4.1. Lập trình hướng đối tượng (Object oriented programming) trong Javascript

  • Tác giả: Anh Nguyen Ngoc
  • Ngày đăng: 2022-03-15
  • Đánh giá: 4 ⭐ ( 3262 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Lập trình Javascript cơ bản – v2022 playlist: https://www.youtube.com/watch?v=_8Ghr7q91n4&list=PLn9lhDYvf_3GY1tTJ0gu4-KRtrm8yeEak
    Fan Page: https://www.facebook.com/proit4all
    Nhóm thảo luận: https://www.facebook.com/groups/115838366528104

    Javascript_ProIT4All Javascript WEB1042

Hàm push() trong JavaScript

  • Tác giả: hocjavascript.net
  • Đánh giá: 5 ⭐ ( 7554 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài viết này, chúng ta sẽ tìm hiểu về hàm push() trong JavaScript. Nếu như ở các ngôn ngữ lập trình khác. Việc thêm phần tử vào mảng

Làm cách nào để thêm cặp khóa / giá trị vào đối tượng JavaScript?

  • Tác giả: qastack.vn
  • Đánh giá: 4 ⭐ ( 1422 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: [Tìm thấy giải pháp!] Có hai cách để thêm thuộc tính mới vào một đối tượng: var obj = {…

Đối tượng / Object trong Javascript (đọc hiểu trong 5 phút)

  • Tác giả: giarefx.com
  • Đánh giá: 4 ⭐ ( 2464 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Các cách lập trình hướng đối tượng trong JavaScript – Blog

  • Tác giả: vn.got-it.ai
  • Đánh giá: 3 ⭐ ( 6851 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hướng đối tượng trong JavaScript làm như thế nào? Bài viết dưới đây sẽ giúp bạn hiện thực hóa các đặc tính của OOP với 4 thủ thuật lập trình hướng đối tượng trong JavaScript cực đơn giản và hiệu quả.

Thêm phần tử vào mảng trong JavaScript (unshift, push, index)

  • Tác giả: laptrinhcanban.com
  • Đánh giá: 4 ⭐ ( 7702 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hướng dẫn cách thêm phần tử vào mảng trong JavaScript. Bạn sẽ học được cách sử dụng index, phương thức push() và unshift() để thêm một hoặc nhiều phần tử vào mảng JavaScript trong bài học này.

[Tự học Javascript] Sao chép đối tượng, tham chiếu trong Javascript

  • Tác giả: cafedev.vn
  • Đánh giá: 5 ⭐ ( 3850 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Một trong những điểm khác biệt cơ bản của các đối tượng so với kiểu nguyên thủy là chúng được lưu trữ và sao chép bởi các tham chiếu.

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Cách lấy giá trị đơn từ một mảng trong PHP - php lấy giá trị mảng