数据劫持的冲突问题

在近段时间我又再一次使用了数据劫持，发现了一些冲突问题，并在此介绍我所应用的场景。

一、冲突问题

在之前的文章中有介绍过数据劫持，但后来使用的很少，最近在一次使用的过程中，发现了一些问题。

1.value属性的冲突

在Object.defineProperty中(在之前的文章有详细介绍过哦)的value属性所代表的含义是设置某个对象中所被劫持的属性值的默认值。

而当我设置好value值后，想在设置get和set方法，发现报了以下错误：

翻译为：属性描述符无效，不能同时指定放问题和值或可写属性 

代码如下：

let obj = {
    a: 1
}

Object.defineProperty(obj, 'a', {
        writable: false,
        value: 1,
        set(val) {
            console.log(val);
        },
        get() {
            console.log(1);
        }
})

那么通过这个错误我又又发现不止是value属性会冲突，还有一个属性会冲突。

2.writable属性的冲突

其实writable属性的冲突原因是和value属性的冲突原因是一样的；

writable属性的作用是我们无法修改被劫持属性的值。

冲突：属性描述符无效，不能同时指定放问题和值或可写属性 

 二、应用场景

在我写一段代码的时候，我是不想让别人去修改我的代码的，因此我使用了数据劫持的方法：

let obj = {
    a: 1
}

Object.defineProperty(obj, 'a', {
    enumerable: false, //不可被枚举(即不可被遍历)
    configurable: false, //此属性不可修改
    writable: false, //属性不可重写
    value: 1 //设置默认值
})

但后来发现我去修改这个值的时候没有发现修改，其他人使用的话压根不知道这个东西不能修改，因此我又改成了这样：

let obj = {
    a: 1
}
let a = 1

Object.defineProperty(obj, 'a', {
    set: function(val) {
        console.error(`兄弟，a属性的值为${a}，你将其修改为${val}，它是不可修改滴`)
        // 也可使用 throw new Error来抛出错误
    },
    get: function() {
        return a
    }
})

obj.a = 2

此时其他人修改我的数据时，则会报错，并且告诉你不能修改此属性(20行为consloe.error，21行为throw new Error所抛出的错误)：

以上便是本次的总结了，如有问题可以私信或评论哦