属性特性get/set
get/set访问器是属性的特性;
特性只有内部才用,因此在javaScript中不能直接访问他们;
(1)数据属性——包含一个数据值的位置。这个位置可以读入和写入值。
数据属性有描述其行为的四个特性:
[[Configurable]]:是否可配置
[[Enumerable]]:是否可枚举
[[Writable]]:是否可读
[[Value]]: 属性值
(2)访问器属性属性——不包含数据值,包含一个getter和setter函数(这两个函数不是必须的)
访问器属性也有描述其行为的四个特性:
[[Configurable]]:是否可配置
[[Enumerable]]:是否可枚举
[[Get]]:在读取属性时调用的函数,默认是undefined
[[Set]]:在写入属性时调用的函数,默认是undefined
get/set访问器行为特点:
get/set访问器可以不用定义,不定义也可以读写属性值。也可以只定义一个。只定义get,则被描述的属性只可读,不可写。只定义set,则被描述的属性只可写,不可读。
总结
只声明了get pro(){}属性 可读不可写;
只声明 set pro(){}属性可写不可读。
如果都不声明,属性可读可写;
如果都声明就按照,get set 定义的方法,读写;
如果都声明了,但是定义的读写方法不能正确读写,get/set失效。变成默认的可读可写
在prototype里面定义的value属性,定义了get 特性。依然可以控制value属性的读写 。也就是说obj.value访问属性时,会调用get方法,先在对象本身寻找,如果没有,再到prototype寻找,如果都没有才算没有定义,默认的既可读又可写。
get是得到,一般是要返回的,set是设置,不用返回;
如果调用对象内部属性约定的命名方式是 _名称;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>get/set</title>
</head>
<body>
<input id="both" type="text" placeholder="请输入你的出生年,比如1989">
<button id="btn">计算</button>
结果:<p id="text"></p>
</body>
</html>
<script>
var myV = document.getElementById("both");
var btn = document.getElementById("btn");
var age = 18;
var test = {
get age (){
return age;
},
set age (value){
if(value > 100) age= new Date().getFullYear() - value;
else age = value;
}
};
console.log(test.age);//18 btn.onclick = function(){
test.age = myV.value;
console.log("age值:"+test.age); cart.wheels = myV.value;
console.log("wheels值:"+cart.wheels);
} const cart = {
_wheels:4,
// get wheels(){
// return this._wheels;
// },
// set wheels(value){
// if(value < this._wheels){
// throw new Error('小了');
// }
// this._wheels = value;
// }
get wheels (){
return this._wheels;
},
set wheels (value){
if(value > 100) this._wheels= new Date().getFullYear() - value;
else this._wheels = value;
}
}
console.log(cart);//{_wheels: 4}
console.log(cart.wheels);//4 </script>
属性特性get/set的更多相关文章
- JavaScript的检测属性、属性特性、枚举属性
/* 检测属性 检测属性可以通过三种方式 1.通过in运算符 2.通过hasOwnPerperty() 如果给定的属性是继承属性将返回false 3.通过propertyIsEnumerable(): ...
- js 中对象属性特性的描述
如何自定义属性的特性? 用对象.属性的特性和自定义的属性的特性有什么区别? 它的四大特性 writable enumerable configable 有什么区别? 先预习一个用对象.属性 ...
- JavaScript中的对象描述符(属性特性)
我们先创建一个对象: var person = { name: "Nicholas", _job: "Software Engineer", sayName: ...
- js知识梳理1:理解对象的属性特性
1.数据属性 数据属性的4个特性: Configurable:①表示能否通过delete删除属性从而重新定义,②能否修改属性的特性,③能否把属性修改为访问器属性.对象直接量里默认值true. Enum ...
- js对象—类型和属性特性
前言 权威指南中摘要的,工作中用不到的,重要的js基础. 三类对象两类属性 内置对象(native object) 是由ECMScript规范定义的对象或者类.例如:函数,数组,日期,正则... 宿主 ...
- NotMapped属性特性
NotMapped特性可以应用到领域类的属性中,Code-First默认的约定,是为所有带有get,和set属性选择器的属性创建数据列.. NotManpped特性打破了这个约定,你可以使用NotMa ...
- ECMA5中定义的对象属性特性和方法
ECMA5规定了只有内部才有的特性,描述了属性的各种特征,这些特性用于实现JavaScript引擎,因此在Js中不能直接访问他们.为了标识特性,我们一般会他们放入两对方括号中. ECMAScript中 ...
- Objective-c的@property(atomic,nonatomic,readonly,readwrite,assign,retain,copy,getter,setter) 属性特性
assign:指定setter方法用简单的赋值,这是默认操作.你可以对标量类型(如int)使用这个属性.你可以想象一个float,它不是一个对象,所以它不能retain.copy. retain:指定 ...
- JS属性描述符之Object.defineProperty()定义对象属性特性
一.Object.defineProperty的作用 用来给对象新增属性,和修改对象中的属性. 二.JS对象中的描述符 js对象中两种属性描述符:数据描述符和存取描述符(访问描述符). 注意事项: 1 ...
随机推荐
- 如何去掉jQWidgets中TreeGrid和Grid右下角的链接
关于如何去掉这个水印,这是官方的说法. 更新了jQWidgets版本,发现在使用过程中发现每次渲染完TreeGrid和Grid后会在表格右下角出现一个www.jqwidgets.com的span标签. ...
- at 命令
每天什么时候执形at 12:00 /every:Monday,Tuesday,Wednesday,Thursday,Friday,Saturday,Sunday shutdown -r
- MATLAB:保存mat文件
X_Y_pred_00_0000.mat里存有三个mat文件: 另存:
- glsl boom
原理: 1.渲染场景到fbo 2.对fbo进行高斯横向,纵向模糊,到新的fbo 3.对两张图进行叠加 模糊后的 效果就这样 给数据加大 <-vertex-> #version varyin ...
- iOS:TabBarController 显示/隐藏第一级页面的TabBar
- (void)setTabBarHidden:(BOOL)hidden { UIView *tab = self.tabBarController.view; ) { return; } UIVie ...
- 自动批改android模拟器的imei的小程序 和 下载各个版本SDK Tools及ADT
ADT 22.6.0版本的下载路径是:http://dl.google.com/android/ADT-22.6.0.zip ADT22.6.1版本的下载路径是:http://dl.google.co ...
- 关于微博开放平台Oauth2.0接入网站应用
关于什么是微博开放平台及微博开放平台能做什么,咱就不做搜索引擎的搬运工了 这里直接给个链接介绍:微博开放平台 本文只是抛砖引玉,讲讲微博开放平台的基本用法,适合没接触过开放平台的朋友入门学习,老鸟就略 ...
- 微信小程序省市区选择器对接数据库
前言,小程序本身是带有地区选着器的(网站:https://mp.weixin.qq.com/debug/wxadoc/dev/component/picker.html),由于自己开发的程序的数据是很 ...
- CSS3与动画有关的属性transition、animation、transform对比
最近应公司需求,需要用css3做动画,终于把以前一直傻傻分不清楚的三个属性理解了. 索性在这里进行一个简单的对比,加深自己的记忆. 浏览器兼容性 CSS3 transform 属性 Internet ...
- Can't clobber writable file **************
最近搭建了新的quick check server, workspace也是新的.但是get latest (unshelve)的时候,出现以下错误: can't clobber writable f ...