DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js对象的set和get 以及关于控制台打印的几种快捷效果title>
head>
<body>
<script type="text/javascript">
// JavaScript对象之get/set方法
let obj = {
name: 'bob',
job: '程序员',
set age(val) {
console.log(new Date().getFullYear(), val, 'val') // 2021 30 "val"
},
get age() {
return new Date().getFullYear() - 1993
}
}
// 对象初始化之后添加属性 方式一
obj.__defineGetter__('sex', function() {
return sex
});
obj.__defineSetter__('sex', function(val) {
sex = val
});
// 对象初始化之后添加属性 方式二 Object.defineProperty定义的属性默认是不可配置的,即 writable=false,configuarble=false
// 解决方法是给当前对象定义一个可配置的属性 {writable:true, configuarble:true, enumerable:true, value: xxx}
// 对象的四个特性
// 值(value):对象可以通过.访问其属性值
// 可写性(writable):控制值(value)是否可修改,默认是true可修改的
// 可枚举性(enumerable):控制是否可用for in遍历到默认是true,即使不能for in,用"."也能访问 【控制台灰色的标识不可枚举加上此属性即可变为可枚举】
// 可配置性(configurable):控制是否可以修改其他特性,是否可以删除属性,修改不可逆转默认是true;
Object.defineProperty(obj, 'desc', {
enumerable: true,
set: function(val) {
console.log('desc被赋值:', val);
desc = val
},
get: function() {
console.log('desc被取出:', desc)
return desc
}
})
// 如果有set 和 get 就会覆盖 writable 但是依旧可以使用 configurable 和 enumerable
Object.defineProperty(obj, 'info', {
writable: true,
configuarble: true,
enumerable: true,
value: '描述信息'
})
console.log(obj.age) // 28
obj.sex = 'man'
obj.desc = '新增属性'
obj.age = 30
console.log(obj.age) // 28
console.log(obj.desc)
console.log(obj)
console.log(obj.info, '更改前') // 描述信息 更改前
obj.info = '更改描述信息成功'
console.log(obj.info, '更改后') // 更改描述信息成功 更改后
console.info({ ...obj })
// 关于打印
let arr = [{
id: 1,
name: 'bob'
}, {
id: 2,
name: 'lala'
}, {
id: 3,
name: 'coco'
}]
console.log(1) // 值
console.info(1) // 信息
console.debug(1) // 调试信息
console.warn(1) // 警告信息
console.dir(obj) // 以列表形式输出一个对象的所有属性
console.table(obj)
console.table(arr) // 以表格形式展示数组
console.table(arr, ['id']) // 只看id那一列
script>
body>
html>
自己整理,请勿随意转载!!!!
Original: https://www.cnblogs.com/lhl66/p/14487841.html
Author: 蓝色帅-橙子哥
Title: JavaScript对象之get/set方法
原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/536026/
转载文章受原作者版权保护。转载请注明原作者出处!