Hướng dẫn array key-value javascript

Nội dung chính Show

Object.keys trong JavaScript
Object.values trong JavaScript
Object.entries trong JavaScript
Tổng kết

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);

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]);
});

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);

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);

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.

Viết bởi Kiyoshi. Đã đăng ký bản quyền tác giả tại <a title="Bạn được tự do chia sẻ bài viết nhưng phải để lại đường link bài viết từ laptrinhcanban.com. Bạn không được sử dụng tài liệu cho mục đích thương mại. Không được phép chỉnh sửa nội dung được phát hành trên website của chúng tôi" style="color:#fff;background-color:silver" rel="license noopener" target="_blank" href="https://creativecommons.org/licenses/by-nc-nd/4.0/">Creativecommons</a>&nbsp;và <a title="Bạn được tự do chia sẻ bài viết nhưng phải để lại đường link bài viết từ laptrinhcanban.com. Bạn không được sử dụng tài liệu cho mục đích thương mại. Không được phép chỉnh sửa nội dung được phát hành trên website của chúng tôi" style="color:#fff;background-color:silver" target="_blank" rel="noopener" href="https://www.dmca.com/Protection/Status.aspx?ID=1631afcd-7c4a-467d-8016-402c5073e5cd" class="dmca-badge">DMCA</a><script src="https://images.dmca.com/Badges/DMCABadgeHelper.min.js"></p><h3 style="font-size:15px">Bài viết liên quan</h3><ul class="popular-posts"><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/chuyen-array-sang-object-trong-javascript-object-fromentries/" title="Chuyển Array sang Object trong JavaScript(Object.fromEntries)" rel="bookmark">Chuyển Array sang Object trong JavaScript(Object.fromEntries)</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/duyet-object-trong-javascript/" title="Duyệt object trong javascript" rel="bookmark">Duyệt object trong javascript</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/copy-object-trong-javascript/" title="Copy Object trong JavaScript" rel="bookmark">Copy Object trong JavaScript</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/khai-bao-object-trong-javascript/" title="Khai báo Object trong JavaScript" rel="bookmark">Khai báo Object trong JavaScript</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/kiem-tra-object-trong-javascript/" title="hasOwnProperty trong Javascript và cách kiểm tra thuộc tính có trong object" rel="bookmark">hasOwnProperty trong Javascript và cách kiểm tra thuộc tính có trong object</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/object-freeze-trong-javasript/" title="Object.freeze trong JavaScript và cách đóng băng object" rel="bookmark">Object.freeze trong JavaScript và cách đóng băng object</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/object-assign-trong-trong-javascript/" title="Object.assign trong javascript và cách gộp object" rel="bookmark">Object.assign trong javascript và cách gộp object</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/truy-cap-thuoc-tinh-cua-object-javascript/" title="Truy cập và lấy thuộc tính của object trong javascript" rel="bookmark">Truy cập và lấy thuộc tính của object trong javascript</a></h3></div></li></ul></div><div id="keugoi"><span>Hãy chia sẻ và cùng lan tỏa kiến thức lập trình Nhật Bản tại Việt Nam!</span></div><section class="icon-bar-2" style="border-bottom:dotted grey .3px!important"><a target="_blank" title="chia sẻ qua facebook" rel="noopener noreferrer" href="https://www.facebook.com/sharer/sharer.php?u=https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/chuyen-object-sang-array-trong-javascript-keys-values-entries/" class="facebook"><i class="fa fa-facebook"></i></a> <a target="_blank" rel="noopener noreferrer" href="https://twitter.com/intent/tweet?url=https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/chuyen-object-sang-array-trong-javascript-keys-values-entries/" title="chia sẻ qua twitter" class="twitter"><i class="fa fa-twitter"></i></a> <a target="_blank" rel="noopener noreferrer" href="https://getpocket.com/edit?url=https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/chuyen-object-sang-array-trong-javascript-keys-values-entries/" title="chia sẻ qua pocket" class="pocket"><i class="fa fa-get-pocket"></i></a> <span class="zalo-share-button" title="chia sẻ qua zalo" style="margin-left:18px;margin-bottom:-3px" data-href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/chuyen-object-sang-array-trong-javascript-keys-values-entries/" data-oaid="579745863508352884" data-layout="3" data-color="blue" data-customize="false"></span></section><p class="ico-folder"><a target="_blank" href="https://laptrinhcanban.com/"><span itemprop="HOME">HOME</span></a><span class="sya"></span>>> <a target="_blank" class="article-category-link" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/">học javascript - lập trình javascript cơ bản</a>>><a target="_blank" class="article-category-link" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/">10. object trong javascript</a></p><nav id="article-nav"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/truy-cap-thuoc-tinh-cua-object-javascript/" id="article-nav-older" class="article-nav-link-wrap" style="float:left;text-align:right;padding-right:20px"><strong class="article-nav-caption">Bài sau</strong><div class="article-nav-title">Truy cập và lấy thuộc tính của object trong javascript</div></a><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/object-trong-javascript/chuyen-array-sang-object-trong-javascript-object-fromentries/" id="article-nav-newer" class="article-nav-link-wrap" style="float:right;text-align:left;padding-left:20px"><strong class="article-nav-caption">Bài tiếp</strong><div class="article-nav-title">Chuyển Array sang Object trong JavaScript(Object.fromEntries)</div></a><span id="ezoic-pub-ad-placeholder-611" class="ezoic-adpicker-ad"></span></nav><div id="recent_posts_down"><div class="widget_athemes_tabs"><ul id="widget-tab" class="clearfix widget-tab-nav"><li class="active">Bài viết mới nhất</li></ul><div class="widget"><ul><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/lam-tron-so-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban46.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/lam-tron-so-trong-javascript/">Làm tròn số trong JavaScript (Math.round, Math.ceil, Math.floor)</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/so-mu-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban45.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/so-mu-trong-javascript/">Số mũ trong JavaScript (Math.pow, Math.exp)</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-max-math-min-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban44.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-max-math-min-trong-javascript/">Math.max và Math.min trong JavaScript</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-random-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban43.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-random-trong-javascript/">Math.random trong JavaScript</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/throw-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban42.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/throw-trong-javascript/">throw trong JavaScript và cách trả về ngoại lệ tuỳ ý</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/cac-ngoai-le-trong-javascript-va-cach-xu-ly/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban41.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/cac-ngoai-le-trong-javascript-va-cach-xu-ly/">Các ngoại lệ trong JavaScript và cách xử lý tương ứng</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/try-catch-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban40.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/try-catch-trong-javascript/">try...catch trong JavaScript và cách xử lý ngoại lệ</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/xu-ly-ngoai-le-cua-ham-xu-ly-mo-ta-trong-khoi-try/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban39.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/xu-ly-ngoai-le-cua-ham-xu-ly-mo-ta-trong-khoi-try/">Xử lý ngoại lệ của hàm xử lý mô tả trong khối try</a></span> <span>tháng 7 1, 2022</span></div></li></ul></div></div></div><footer class="entry-meta entry-footer"></footer><hr class="entry-footer-hr"></div><span class="ezoic-autoinsert-ad ezoic-longest_content"></span><div id="profiletitle2">Profile</div><div id="profileblock2"><div id="profilephoto2"><a target="_blank" rel="noopener" href="https://www.facebook.com/mr.nchita"><img width="100" height="100" alt="きよしです！笑" ezimgfmt="rs rscb2 src ng ngcb2" class="ezlazyload" data-ezsrc="/css/images/kiyoshi.webp"></a></div><div id="profiletext2"><p>Tác giả : <a href="https://www.facebook.com/mr.nchita" target="_blank" rel="nofollow noopener">Kiyoshi (Chis Thanh)</a></p><p>Kiyoshi là một <a href="https://www.youtube.com/c/ChisThanh" target="_blank" rel="nofollow noopener">cựu du học sinh tại Nhật Bản</a>. Sau khi tốt nghiệp đại học Toyama năm 2017, Kiyoshi hiện đang làm BrSE tại Tokyo, Nhật Bản.<span id="ezoic-pub-ad-placeholder-196" class="ezoic-adpicker-ad"></span></p></div></div></div></article><aside id="sidebar"><div id="sidebar_first"><span class="ezoic-autoinsert-ad ezoic-sidebar"></span><div class="search" style="margin-top:-30px"><div id="fb-root"></div><script async defer crossorigin="anonymous" src="https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v12.0&appId=3084959888222500&autoLogAppEvents=1" nonce="KPkvxeh4">