VUE中data配置项详细解析

data: {
                    // 定义字符串
                    name: "谷哥的小弟",
                    // 定义整数
                    number:9527,
                    // 定义数组
                    hobby:["篮球","足球","击剑"],
                    // 定义对象
                    user:{id: 21, name: "zxx", age: 50},
                    // 定义对象数组
                    users:[
                        {id: 21, name: "zxx", age: 50},
                        {id: 22, name: "zxc", age: 51},
                        {id: 23, name: "zcc", age: 52},
                    ]
                }

const app = new Vue({
    el:"#app",
    // 对象格式
    data:{
        foo:"foo"
    },
    // 函数格式
    data(){
        return {
             foo:"foo"
        }
    }

Vue.component('component1',{
    template:`<div>组件</div>`,
     data(){
        return {
             foo:"foo"
        }
    }
})

let obj = {
    name: "小明",
    age:19
}
let obj1 = obj 
obj.name = "小红"
// 此时   obj1.name == "小红"
// 并且   obj.name == "小红"

    function Person(name,age){
        this.name = nmae;
        this.age = age ;
        this.race = "汉族"
    }
    let ming = new Person("xiaoming",19)
    let hong = new Person("xiaohong",20)
    console.log(ming)
    console.log(hong)
    // 此时如果我们把小明的名族改了
    ming.race="维吾尔族"
    console.log(ming)
    console.log(hong)
    // 我们再去查看一下会发现，小明小红都变成了维吾尔族