这是我参与「第五届青训营」伴学笔记创作活动的第 20 天

每当我想将对象转数组的时候，总是想不起来entries这个api，虽然之前有用过，但是还是在脑子🧠留不下记忆，今天我将通过Object中的keys，value，ent

keys demo

const object1 = {
  a: 'somestring',
  b: 42,
  c: false
};

console.log(Object.keys(object1));
// Expected output: Array ["a", "b", "c"]

从api的意思和结果来看，不难看的出，这里的输入和输出：

Input: obj

output：Array【keys】

Values demo

var obj = { foo: 'bar', baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]

这里的返回值和keys刚好相反，keys返回key，values返回value，如api名称所示

input：obj

Output：Array【values】

entries

那entries就是keys和values的结合体

⚠️：如果原对象的属性名是一个 Symbol 值，该属性会被忽略。

const object1 = {
  a: 'somestring',
  b: 42
};

const arr = Object.entries(object1)
console.log(arr)
// [
//     [
//         "a",
//         "somestring"
//     ],
//     [
//         "b",
//         42
//     ]
// ]


Object.entries({ [Symbol()]: 123, foo: 'abc' });
// [ [ 'foo', 'abc' ] ]

Object.entries 方法的另一个用处是，将对象转为真正的 Map 结构。说到map又引发了我的思考，既然map那么多优点，为啥不用map呢。这里参考了blog.csdn.net/weixin_4090…

答案是JSON.stringify()无法转化ES6中map数据问题。

使用 Object：

只是简单的数据结构时，选择 Object，因为它在数据少的时候占用内存更少，且新建时更为高效
需要用到 JSON 进行文件传输时，选择 Object，因为 JSON 不默认支持 Map
需要对多个键值进行运算时，选择 Object，因为句法更为简洁
需要覆盖原型上的键时，选择 Object

虽然 Map 在很多情况下会比 Object 更为高效，不过 Object 永远是 JS 中最基本的引用类型，它的作用也不仅仅是为了储存键值对。⚠️：map也是引用类型

// 使用常规的 Map 构造函数可以将一个二维键值对数组转换成一个 Map 对象
const obj = { foo: 'bar', baz: 42 };
const map = new Map(Object.entries(obj));
map // Map { foo: "bar", baz: 42 }

Object.fromEntries

而这个api，刚好与entries相反，enries是把对象转成包含key和value的数组，fromEntries是把key-value嵌套数组转换成对象

const nestedArray = [  ['key 1', 'value 1'],
  ['key 2', 'value 2']
]

Object.fromEntries(nestedArray);
// { key 1: "value 1", key 2: "value 2"}

该方法的主要目的，是将键值对的数据结构还原为对象，因此特别适合将 Map 结构转为对象

// 例一
const entries = new Map([
  ['foo', 'bar'],
  ['baz', 42]
]);

Object.fromEntries(entries)
// { foo: "bar", baz: 42 }

// 例二
const map = new Map().set('foo', true).set('bar', false);
Object.fromEntries(map)
// { foo: true, bar: false }

该方法的一个用处是配合 URLSearchParams 对象，将查询字符串转为对象。

URLSearchParams：developer.mozilla.org/zh-CN/docs/…

Object.fromEntries(new URLSearchParams('foo=bar&baz=qux'))
// { foo: "bar", baz: "qux" }

关于Object的keys，value和entries的思考｜ 青训营笔记

entries

Object.fromEntries

关于Object的keys，value和entries的思考｜青训营笔记