js监听对象属性的改变-笔试面试资料

这是qklbishe.com第5139 篇笔试面试资料
提供答案分析,通过本文《js监听对象属性的改变-笔试面试资料》可以理解其中的代码原理,这是一篇很好的求职学习资料
本站提供程序员计算机面试经验学习,笔试经验,包括字节跳动/头条,腾讯,阿里,美团,滴滴出行,网易,百度,京东,小米,华为,微软等互联网大厂真题学习背诵。

答案:

js监听对象属性的改变

js监听对象属性的改变 Mr.mǎ.

ES5:通过getter和setter

var obj={};

Object.defineProperty(obj,’data’,{

__get:function(){

____return data;

__},

__set:function(newValue){

____data=newValue;

____console.log(‘set :’,newValue);

____//需要触发的渲染函数写在这…

__}

})

// 测试

obj.data=5; //set: 5

//同时定义多个变量的setter和getter

var obj = {};

Object.defineProperties(obj, {

__a: {

____configurable: true, //表示该属性描述符可以被改变(默认为false)

____get: function() {

______console.log(‘get: ‘,a)

______return a

____},

____set: function(newValue) {

______a = newValue;

______console.log(‘set: ‘,a)

____}

__},

__b: {

____configurable: true,

____get: function() {

______console.log(‘get: ‘,b)

______return b;

____},

____set: function(newValue) {

______b = newValue;

______console.log(‘set: ‘,b)

____}

__}

})

———————————————

ES6:Proxy

let validator = {

__set: function(obj, prop, value) {

____if (prop === ‘age’) {

______if (!Number.isInteger(value)) {

________throw new TypeError(‘The age is not an integer’);

______}

______if (value > 200) {

________throw new RangeError(‘The age seems invalid’);

______}

____}

____// The default behavior to store the value

____obj[prop] = value;

____}

__};

let person = new Proxy({}, validator);

person.age = 100;

console.log(person.age);

// 100

person.age = ‘young’;

// 抛出异常: Uncaught TypeError: The age is not an integer

person.age = 300;

// 抛出异常: Uncaught RangeError: The age seems invalid

2020-12-25 15:08:10 回复(0)

文章部分来自互联网,侵权联系删除
www.qklbishe.com

区块链毕设网(www.qklbishe.com)全网最靠谱的原创区块链毕设代做网站
部分资料来自网络,侵权联系删除!
资源收费仅为搬运整理打赏费用,用户自愿支付 !
qklbishe.com区块链毕设代做网专注|以太坊fabric-计算机|java|毕业设计|代做平台 » js监听对象属性的改变-笔试面试资料

提供最优质的资源集合

立即查看 了解详情