前端 - 请问在Vue2中，如果你在data函数中声明了一个对象属性，那么初始值是赋{}还是null?

Question

如题所示，现在很纠结一个对象类型的属性，初始化赋值应该选哪种？

应该选{}，还是null？选择的理由是什么？有什么区别？求大神能解答下，谢谢

下面是选null

<template>  <div>    <p>{{ myObject.name }}</p>    <button @click="updateObject">更新对象</button>  </div></template><script>export default {  data() {    return {      myObject: null, // 初始化为 null    };  },  methods: {    updateObject() {      // 通过 this.myObject 来访问对象      this.myObject = { name: 'value' };    },  },    created(){        this.myObject = { name: 'wt' };    }};</script>

下面选{}

<template>  <div>    <p>{{ myObject.name }}</p>    <button @click="updateObject">更新对象</button>  </div></template><script>export default {    data() {      return {        myObject: {}, // 初始化为{}      };    },    methods: {      updateObject() {        // 通过 this.myObject 来访问对象        this.myObject = { name: 'value' };      },    },    created(){        this.myObject = { name: 'wt' };    }};</script>

Answer 1

如果每次更新都是直接 替换整个对象 ，那怎么声明都没差别，我个人习惯声明为 null ；如果改动只涉及属性，不涉及对象本身（索引）的替换那就用 {}

要说区别的话，空对象 {} 的布尔值也是 true （因为引用类型赋值后内存空间的索引就存在了），但 null 是 false，从这个角度来说，如果要 判断某个对象是否存在 再进行下一步操作，初始化为 null 是相对合理的选择

但也不是说 {} 就不能判断，只是说要额外操作（比如可以用 Object.keys().length 判断空对象），所以上述也只是我个人的选择，如果团队规范没有明确规定的话，可以参考参考

Answer 2

一般建议是数字初始化为0，字符串初始化为空字符，数组初始化为空数组，对象初始化为null，对象为Null更容易判断该对象是否已经被赋值，不过一般区别不大，
但是如果这个对象开始需要参与到视图渲染的，初始化为null可能会导致视图渲染报错，
总之不是固定的