HOME › học javascript - lập trình javascript cơ bản>>10. object trong javascript

Chuyển object sang Array trong Javascript(Object.keys, Object.values, Object.entries)

20 tháng 12 ,2021

Hướng dẫn cách chuyển object sang Array trong Javascript. Bạn sẽ học được cách chuyển object sang Array trong Javascript với việc lấy toàn bộ thuộc tính và giá trị trong object, bằng các phương thức như key, values, entries trong JavaScript sau bài học này.

Chúng ta có 3 phương pháp để chuyển object sang Array trong Javascript với việc lấy phần tử trong object như sau:

Phương thức Object.keys : lấy toàn bộ tên thuộc tính trong object javascript dưới dạng mảng
Phương thức Object.values : lấy toàn bộ giá trị thuộc tính trong object javascript dưới dạng mảng
Phương thức Object.entries : lấy toàn bộ tên thuộc tính và giá trị trong object javascript dưới dạng mảng

Object.keys trong JavaScript

Object.keys trong JavaScript là một phương thức trong object Object, có tác dụng lấy toàn bộ tên thuộc tính trong object javascript và trả về kết quả dưới dạng một mảng, qua đó có thể chuyển object sang Array trong Javascript.

Chúng ta sử dụng phương thức keys để lấy toàn bộ tên thuộc tính (key) trong object javascript như sau:

Object.keys(obj);

Trong đó obj là object cần lấy toàn bộ tên thuộc tính.

Sau khi thực thi Object.keys trong JavaScript, toàn bộ tên thuộc tính sẽ được trả về dưới dạng một mảng kết quả, như ví dụ sau đây:

let user = {
  name:'Kiyoshi',
  age:30,
  address:'Tokyo'
};

let keyArray = Object.keys(user);
console.log(keyArray);
//[ 'name', 'age', 'address' ]

Giống như trên thì toàn bộ 3 key - tên thuộc tính trong object đã được trả về dưới dạng một mảng như trên.

Ngoài ra nếu chúng ta sử dụng thêm forEach trong JavaScript thì ngoài toàn bộ tên thuộc tính, chúng ta cũng có thể lấy toàn bộ các giá trị tương ứng của thuộc tính lần lượt như sau:

let user = {
  name:'Kiyoshi',
  age:30,
  address:'Tokyo'
};

let keyArray = Object.keys(user);

keyArray.forEach(function(element){
  console.log(user[element]);
});
//Kiyoshi
//30
//Tokyo

Object.values trong JavaScript

Object.values trong JavaScript là một phương thức trong object Object, có tác dụng lấy toàn bộ giá trị của thuộc tính trong object JavaScript và trả về kết quả dưới dạng một mảng, qua đó có thể chuyển object sang Array trong Javascript.

Chúng ta sử dụng phương thức values để lấy toàn bộ giá trị của thuộc tính trong object JavaScript như sau:

Object.values(obj);

Trong đó obj là object cần lấy toàn bộ giá trị của thuộc tính trong JavaScript.

Sau khi thực thi Object.values trong JavaScript, toàn bộ giá trị (value)sẽ được trả về dưới dạng một mảng kết quả, như ví dụ sau đây:

let user = {
  name:'Kiyoshi',
  age:30,
  address:'Tokyo'
};

let keyArray = Object.values(user);
console.log(keyArray);
//[ 'Kiyoshi', 30, 'Tokyo' ]

Giống như trên thì toàn bộ 3 các cặp key:value trong object đã được trả về dưới dạng một mảng như trên.

Object.entries trong JavaScript

Object.entries trong JavaScript là một phương thức trong object Object, có tác dụng lấy toàn bộ thuộc tính và giá trị tương ứng trong object JavaScript và trả về kết quả dưới dạng một mảng, qua đó có thể chuyển object sang Array trong Javascript.

Chúng ta sử dụng phương thức entries để lấy toàn bộ thuộc tính và giá trị tương ứng (key:value) trong object JavaScript như sau:

Object.entries(obj);

Trong đó obj là object cần lấy toàn bộ thuộc tính và giá trị tương ứng.

Sau khi thực thi Object.entries trong JavaScript, toàn bộ thuộc tính và giá trị tương ứng sẽ được trả về dưới dạng một mảng kết quả, như ví dụ sau đây:

let user = {
  name:'Kiyoshi',
  age:30,
  address:'Tokyo'
};

let keyArray = Object.entries(user);
console.log(keyArray);
//[ [ 'name', 'Kiyoshi' ], [ 'age', 30 ], [ 'address', 'Tokyo' ] ]

Giống như trên thì toàn bộ 3 các cặp key:value trong object đã được trả về dưới dạng một mảng như trên.

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về cách chuyển object sang Array trong Javascript với việc lấy toàn bộ key:value trong object javascript, bằng các phương thức như key, values, entries trong JavaScript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.