ES6之Object.assign()详解及注意事项

 Object.assign源码：

interface ObjectConstructor {
    /**
     * Copy the values of all of the enumerable own properties from one or more source objects to a
     * target object. Returns the target object.
     * @param target The target object to copy to.
     * @param source The source object from which to copy properties.
     */
    assign<T, U>(target: T, source: U): T & U;

 

Object.assign()与jQuery的extend方法实现的原理类似

 

---

Object.assign的第一个参数是目标对象，可以跟一或多个源对象作为参数，将源对象的所有可枚举（[[emuerable]] === true）复制到目标对象。这种复制属于浅复制，复制对象时只是包含对该对象的引用。Object.assign(target, [source1, source2, ...])

• 如果目标对象与源对象有同名属性，则后面的属性会覆盖前面的属性
• 如果只有一个参数，则直接返回该参数。即Object.assign(obj) === obj
• 如果第一个参数不是对象，而是基本数据类型（Null、Undefined除外），则会调用对应的基本包装类型
• 如果第一个参数是Null和Undefined，则会报错；如果Null和Undefined不是位于第一个参数，则会略过该参数的复制

---

应用1

在Vue中：

    //编辑时初始化数据
    var id = this.$route.params.id;
    this.http.get('/admin/userInfo/' + id).then(resp => {
        // this.form.name = resp.data.docName;
        // this.form.account = resp.data.account;
        // this.form.password = resp.data.password;
        // this.form.mobile = resp.data.mobile;
        // this.form.email = resp.data.email;
        debugger
        Object.assign(this.form, resp.data);
    })
},

---

在mapper.xml中：

    <select id="findById" parameterType="long" resultType="java.util.Map">
        SELECT
        t.name AS docName,
        t3.account AS account,
        t.mobile,
        t.email......
        
        <where>
            AND t.deleted = 0
            AND t.id = #{userId}
        </where>
    </select>

 

注意事项：

复制的源对象与目标，数据名必须要一一对应。比如上面的Object.assign(this.form, resp.data);

---

需要注意的是：当出现这种情况的时候，这样是复制不了的：

//复制的源对象与目标,源名为docName，目标名为name
this.form.name = resp.data.docName;

---

因此，如果使用mapper，那么实体类中映射好的字段名应当一致（一般这样也比较方便），这样就不会出现复制不了的情况。

或许你会在业务层中追加了数据，这也是需要注意的。