Object.defineProperty() 灵活操作和修改对象的属性

Object.defineProperty()是JavaScript中一个用于在对象上定义新属性或修改现有属性的方法，并会返回该对象。

这个方法接受三个参数

• 目标对象(obj):要对其定义属性或修改属性的对象[注]:返回的对象跟这个目标对象是同一个
• 属性名(property):要定义或修改的属性名称
• 属性描述符(descriptor):一个对象,用来描述和定义属性

var  obj1 = {}
var obj2 = Object.defineProperty(obj1,"age",{
    value:"2"
});
console.log(obj1);
console.log(obj2);
console.log(obj1 == obj2); //true

属性描述符(descriptor)

具有以下属性的对象

• value: 设置属性的默认值
• writable:设置属性是否能够修改(值:true/false)
• enumerable:设置属性是否可以枚举(遍历)(值:true/false)
• configurable:设置属性是否可以删除或编辑(值:true/false)
• get:获取属性和值
• set:设置属性和值

var temp;
var obj = Object.defineProperty({},"age",{
    enumerable:true,
    configurable:true,
    get(){
        //把值返回,赋给age 等于 (age = temp)
        return temp
    },
    set(val){ //val是形参
        //判断值符合不符合条件
        if(!(val>=18&&val<=120)){
            console.log("输入的值不合法");
        }else{
            console.log("值合法");
            temp = val;  //设置temp的值
        }
    }   
})

obj.age = "20";
console.log(obj.age); //20
console.log(temp); //20

• 这里可以通过set()去更加准确的设置值
• 再使用get()获取值
• 可以通过Object.defineProperty()做一个简单的代理,间接给temp赋值

Proxy() 定义基本操作的自定义行为

Proxy对象是一种非常有用的构造器，它用于定义基本操作的自定义行为。Proxy对象可以创建一个对象，并对这个对象的某些行为进行拦截和处理

这个构造器接受两个参数

• target: 这个参数是创建的普通对象,包括另一个Proxy
• handler:这是一个对象,它定义了拦截target的陷阱方法

handler具有的方法

• get(target, prop, receiver)：当读取target的prop属性时调用。你可以在这里返回一个值或者一个新的对象。
• set(target, prop, value, receiver)：当给target的prop属性赋值时调用。你可以在这里阻止赋值行为，或者修改将要分配的值。

//创建一个代理对象
//1.被代理对象
var obj = {}

//2.代理对象
const proxy = new Proxy(obj,{
    get(target,property){
        return target[property]
    },  
    set(target,property,value){
        if(property == "age" && value>=18&&value<=50){
            target[property] = value;   //合法就设置
        }else{
            target[property] = 0;   //不合法就给0
        }
    }
})

//3.操作代理对象
proxy.age =20 ;
console.log(proxy.age);
console.log(proxy);

//4.查看被代理对象是否有值
console.log(obj);