Cặp giá trị khóa trong JavaScript là gì?

Các đối tượng là các cấu trúc dữ liệu khá tiện dụng bao gồm một cặp khóa và giá trị. Tuy nhiên, những gì chúng có thể chứa có thể khác nhau, khóa có thể là ký hiệu hoặc chuỗi trong khi giá trị có thể là bất kỳ loại dữ liệu nào

"động vật" là đối tượng. Tên động vật là “chìa khóa” trong khi các số nguyên là “giá trị”

Đôi khi có thể xảy ra một số trường hợp bạn muốn sắp xếp đối tượng của mình theo khóa hoặc giá trị nhưng rất tiếc là không có phương thức JavaScript tích hợp nào để sắp xếp t theo thuộc tính đối tượng

Ở trên chúng ta có một đối tượng được gọi là động vật. Các phím là các chuỗi đóng vai trò là loại động vật. Trong trường hợp giá trị là một số nguyên đại diện cho số lượng động vật được chỉ định. Có 3 phương thức đối tượng có thể được sử dụng để chuyển qua dữ liệu đã cho

Sự vật. mục()

Phương thức này trả về một mảng các cặp thuộc tính có thể đếm được của một đối tượng nhất định

Với phương pháp sau, đối tượng được chuyển đổi thành một mảng, vì vậy bây giờ nó có thể dễ dàng thao tác hơn để lấy thông tin được chỉ định từ đối tượng đã cho. Ví dụ: nếu chúng ta muốn tìm con vật nào có số lượng nhiều nhất, chúng ta có thể sử dụng phương pháp sắp xếp

Điều này sẽ sắp xếp mảng theo thứ tự giảm dần. b[1] — a[1] sẽ sắp xếp mảng bằng cách so sánh các giá trị

Bây giờ chúng ta có một mảng các mảng được sắp xếp và chúng ta có thể dễ dàng lấy cặp có giá trị khóa cao nhất

Sự vật. phím()

Phương thức này sẽ trả về một mảng các khóa của đối tượng đã cho

Sự vật. giá trị()

Phương thức này sẽ trả về một mảng các giá trị của đối tượng đã cho

Phương pháp này hữu ích khi bạn chỉ quan tâm đến phần giá trị của đối tượng. Một ví dụ đang tìm các giá trị cao nhất, thấp nhất hoặc thường xuyên nhất

Tất cả các phương thức được liệt kê ở trên đều có thể chuyển đổi một đối tượng nhất định thành một mảng, cho phép chúng tôi sử dụng các phương thức JavaScript tích hợp để lấy dữ liệu được chỉ định mà chúng tôi muốn

Việc thêm một cặp khóa-giá trị vào một đối tượng JavaScript rất đơn giản, nhưng có nhiều cách để thực hiện việc này. Mặc dù hầu hết đều giống nhau nhưng những cách tiếp cận này có một số điểm khác biệt mà bạn nên biết

ký hiệu dấu chấm

Cách đơn giản và phổ biến nhất để thêm cặp khóa-giá trị vào đối tượng là sử dụng ký hiệu dấu chấm. Bạn có thể đã sử dụng điều này trước đây và nó đủ dùng trong hầu hết các tình huống bạn gặp phải

Ký hiệu dấu ngoặc vuông

Tương tự như ký hiệu dấu chấm, ký hiệu dấu ngoặc vuông có ích khi xử lý các phím động, nhưng cũng có thể hoạt động với các phím tĩnh. Ngoài ra, nó hoàn toàn giống với ký hiệu dấu chấm cả về chức năng và hiệu suất

Sự vật. giao phó()

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

6 hơi khác so với hai tùy chọn trước. Nó có thể được sử dụng để thêm nhiều thuộc tính vào một đối tượng cùng một lúc và nó cũng có thể hợp nhất nông hai hoặc nhiều đối tượng. Tuy nhiên, nó không hiệu quả bằng, vì vậy nó chỉ nên được sử dụng khi cần thiết

Sự vật. định nghĩaProperty()

Một cách khác, ít phổ biến hơn, để thêm một cặp khóa-giá trị vào một đối tượng là sử dụng

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

7. Đây là cách kém hiệu quả nhất để thêm một cặp khóa-giá trị vào một đối tượng, nhưng nó cho phép xác định chính xác thuộc tính mới. Hàm này chấp nhận một bộ mô tả dữ liệu hoặc bộ truy cập làm đối số thứ hai của nó, cho phép hành vi của thuộc tính mới được tùy chỉnh theo ý muốn. Hãy nhớ rằng bạn có thể thêm nhiều thuộc tính cùng một lúc bằng cách sử dụng

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

8

Toán tử trải rộng đối tượng

Cuối cùng nhưng không kém phần quan trọng, đó là toán tử trải rộng đối tượng (

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

9). Trái ngược với các phương thức trước đó, phương thức này không thay đổi đối tượng ban đầu mà thay vào đó trả về một đối tượng mới với các thuộc tính được thêm vào. Đúng như dự đoán, hiệu suất của phương pháp này kém hơn đáng kể so với các phương pháp trước đó, do cần phải tạo một đối tượng mới

Trong ví dụ trên, chúng tôi thêm thuộc tính mới

1 => GeeksforGeeks
2 => Computer
3 => Science

0 vào đối tượng

1 => GeeksforGeeks
2 => Computer
3 => Science

1 bằng cách sử dụng ký hiệu dấu ngoặc vuông

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

0 i. e.

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

1

Chúng tôi đã đưa ra hai mảng chứa khóa và giá trị và nhiệm vụ là lưu trữ nó dưới dạng một thực thể duy nhất ở dạng key => value trong JavaScript. Trong JavaScript, mảng là một biến duy nhất được sử dụng để lưu trữ các phần tử khác nhau. Nó thường được sử dụng khi chúng ta cần lưu trữ danh sách các bộ phận và truy cập chúng theo một biến. Chúng ta có thể lưu trữ mảng key => value trong Đối tượng JavaScript bằng các phương thức được thảo luận bên dưới.  

Phương pháp 1. Ở phương thức này chúng ta sẽ sử dụng Object để lưu key => value trong JavaScript. Các đối tượng, trong JavaScript, là loại dữ liệu quan trọng nhất và tạo thành các khối xây dựng cho JavaScript hiện đại. Các đối tượng này hoàn toàn khác với các kiểu dữ liệu nguyên thủy của JavaScript (Số, Chuỗi, Boolean, null, không xác định và ký hiệu). Các đối tượng phức tạp hơn và mỗi đối tượng có thể chứa bất kỳ sự kết hợp nào của các kiểu dữ liệu nguyên thủy này cũng như các kiểu dữ liệu tham chiếu.  

Cách tiếp cận. Chúng ta sẽ duyệt qua toàn bộ mảng và lần lượt thêm các khóa từ các khóa (mảng) và các giá trị tương ứng từ các giá trị (mảng) trong Đối tượng.  

cú pháp

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

Thí dụ.  

jav

1 => GeeksforGeeks
2 => Computer
3 => Science

2

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

4

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

1 => GeeksforGeeks
2 => Computer
3 => Science

1

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

4

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

1 => GeeksforGeeks
2 => Computer
3 => Science

7

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

0

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

6

1 => GeeksforGeeks
2 => Computer
3 => Science

3

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

8

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

30

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

31

1 => GeeksforGeeks
2 => Computer
3 => Science

0

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

33

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

35

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

37

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

00

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

30

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

31______30

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

05

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

07

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

37

 

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

80

đầu ra

1 => GeeksforGeeks
2 => Computer
3 => Science

Phương pháp 2. Ở phương pháp này chúng ta sẽ sử dụng Map để lưu key => value trong JavaScript. Bản đồ là một tập hợp các phần tử trong đó mỗi phần tử được lưu trữ dưới dạng một cặp khóa, giá trị. Các đối tượng bản đồ có thể chứa cả đối tượng và giá trị nguyên thủy dưới dạng khóa hoặc giá trị. Khi chúng ta lặp lại đối tượng bản đồ, nó sẽ trả về cặp khóa, giá trị theo cùng thứ tự như đã chèn.  

Cách tiếp cận. Chúng tôi sẽ duyệt qua toàn bộ mảng và lần lượt thêm các khóa từ các khóa (mảng) và các giá trị tương ứng từ các giá trị (mảng) trong bản đồ.  

cú pháp

________số 8

Thí dụ.  

jav

1 => GeeksforGeeks
2 => Computer
3 => Science

2

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

4

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

86

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

4

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

1 => GeeksforGeeks
2 => Computer
3 => Science

22

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

30

1 => GeeksforGeeks
2 => Computer
3 => Science

24

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3____927

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

1 => GeeksforGeeks
2 => Computer
3 => Science

30

1 => GeeksforGeeks
2 => Computer
3 => Science

31

1 => GeeksforGeeks
2 => Computer
3 => Science

32

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

for(var i = 0; i < keys.length; i++){
        // mp = Map
        // keys = key array
        // values = value array
        map.set(keys[i], values[i];
}

6

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

37

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

30

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

31

1 => GeeksforGeeks
2 => Computer
3 => Science

0

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

33

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

1 => GeeksforGeeks
2 => Computer
3 => Science

44

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

37

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3____949

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

30

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

31______30

1 => GeeksforGeeks
2 => Computer
3 => Science

34

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

1 => GeeksforGeeks
2 => Computer
3 => Science

36

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

37

 

1 => GeeksforGeeks
2 => Computer
3 => Science

39

đầu ra

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

3

Phương pháp 3. Trong phương pháp này, chúng tôi sẽ sử dụng giảm để lưu khóa => giá trị trong JavaScript. Phương thức giảm là sử dụng lặp qua danh sách các phần tử. Phương thức này được sử dụng để giảm mảng thành một giá trị duy nhất và thực thi hàm được cung cấp cho từng giá trị của mảng (từ trái sang phải) và giá trị trả về của hàm được lưu trữ trong bộ tích lũy

cú pháp

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

0

Thí dụ.  

Javascript

1 => GeeksforGeeks
2 => Computer
3 => Science

2

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

4

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

86

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

4

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

1 => GeeksforGeeks
2 => Computer
3 => Science

11

1 => GeeksforGeeks
2 => Computer
3 => Science

12

1 => GeeksforGeeks
2 => Computer
3 => Science

13

1 => GeeksforGeeks
2 => Computer
3 => Science

14

1 => GeeksforGeeks
2 => Computer
3 => Science

13

1 => GeeksforGeeks
2 => Computer
3 => Science

12

1 => GeeksforGeeks
2 => Computer
3 => Science

13

1 => GeeksforGeeks
2 => Computer
3 => Science

18

1 => GeeksforGeeks
2 => Computer
3 => Science

13

1 => GeeksforGeeks
2 => Computer
3 => Science

20

1 => GeeksforGeeks
2 => Computer
3 => Science

21

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

24

1 => GeeksforGeeks
2 => Computer
3 => Science

25

1 => GeeksforGeeks
2 => Computer
3 => Science

3

1 => GeeksforGeeks
2 => Computer
3 => Science

0

1 => GeeksforGeeks
2 => Computer
3 => Science

28

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

1 => GeeksforGeeks
2 => Computer
3 => Science

30

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

1 => GeeksforGeeks
2 => Computer
3 => Science

32

1 => GeeksforGeeks
2 => Computer
3 => Science

33

1 => GeeksforGeeks
2 => Computer
3 => Science

34

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

30

1 => GeeksforGeeks
2 => Computer
3 => Science

37____338

1 => GeeksforGeeks
2 => Computer
3 => Science

39

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

34

1 => GeeksforGeeks
2 => Computer
3 => Science

41

1 => GeeksforGeeks
2 => Computer
3 => Science

3

{
    name: "Monica",
    age: 22,
    gender: "female",
    height: 5.4
}

37

1 => GeeksforGeeks
2 => Computer
3 => Science

44

1 => GeeksforGeeks
2 => Computer
3 => Science

45

đầu ra

for(var i = 0; i < keys.length; i++){
        // obj = Object
        // keys = key array
        // values = value array
        obj[keys[i]] = values[i];
}

8

JavaScript được biết đến nhiều nhất để phát triển trang web nhưng nó cũng được sử dụng trong nhiều môi trường không có trình duyệt. Bạn có thể học JavaScript từ đầu bằng cách làm theo Hướng dẫn JavaScript và Ví dụ về JavaScript này

chìa khóa là gì

chìa khóa là gì

Công dụng của khóa là gì

Cách lấy chìa khóa