lodash.set 方法的一个小坑

问题描述

import _ from "lodash";

var obj = {};
_.set(obj, 'books.6831119801007205.autoUnlock', false);
// {books: []}

为何发生

import _ from "lodash";

var obj0 = {};
_.set(obj0, `books['6831119801007205'].autoUnlock`, false);
// {books: []}
// 即使在 path 中声明，我不是一个 number，我是一个 string，也是无效的

var obj1 = {};
_.set(obj1, 'books.1.autoUnlock', false);
// {books: [null, {autoUnlock: false}]}
// 可以发现，它将 1 默认识别成数组的 index

如果 key 值中包含一个 number 时，默认这个 number 是一个数组的 index。于是就会尝试去处理一个数组。但是与此同时，我们传入的 number 超出了数组的最大长度，所以最终的返回值是一个空数组。

如何解决

1. 源对象已经包含这个字段

import _ from "lodash";

var obj2 = {books:{6831119801007205:{}}};
_.set(obj2, 'books.6831119801007205.autoUnlock', false);
// {books: 6831119801007205:{autoUnlock: false}}

2. 使用 lodash.setWith ，并传入第四个参数

import _ from "lodash";

var obj3 = {};
_.setWith(obj3, 'books.6831119801007205.autoUnlock', false, Object);
// {books: 6831119801007205:{autoUnlock: false}}

3. 手动构造更新的对象

import _ from "lodash";

var obj4 = {};
var id = '6831119801007205';
var updateData = {
 [id]: {
    autoUnlock: false,
  }
}
_.set(obj4, `books`, updateData);
// {books: 6831119801007205:{autoUnlock: false}}