js之oop <二> 对象属性
js中对象属性可以动态添加和删除。删除对象属性用delete关键字。
function obj(){ }
var oo = new obj();
oo.a = "a";
oo.b = "b";
oo.a; //输出a
oo.b; //输出b
delete oo.a;
oo.a; //输出undefined
在js中对象的属性以键值对的方式来体现,且(在遍历时)无序。js中属性名(也就是key)可以用点来访问(或赋值),也可以用中括号key值来访问(或赋值)(用中括号key访问对象属性时,key必须是string类型)
var a = { x:5,y:2 };
a.x; //输出5
a['x'];//输出5
对象属性的遍历,遍历对象属性常用有两种方法。
var obj = { a1:1, a2:2, a3:3, a4:4, a5:5 };
for(var i=1;i<=5;i++ ){
console.log(obj['a' + i]);
}
//输出 1 2 3 4 5
var obj = { a:1, b:2, c:3, d:4, e:5 };
for(var item in obj){
console.log(obj[item]);
}
//输出 1 2 3 4 5
这里需要注意,for in 遍历对象属性是无序的,有可能遍历到原型链上的属性。且使用 for in 遍历时只能使用[]读取属性,不能使用.读取。
function obj_pro(){} //创建obj_pro构造器
obj_pro.prototype.f = 55; //创建obj_pro原型属性f
var obj = new obj_pro(); //obj_pro创建obj对象
//obj对象属性循环赋值
for(var i=1;i<=5;i++){
obj['a' + i] = (i+9);
}
//遍历obj对象属性
for(var item in obj){
console.log(obj[item]);
}
//输出 10 11 12 13 14 55 这里遍历把原型链上的属性f遍历出来了
****************************************************************************************************************
属性的 get/set
get/set 和其他语言一样,用来封装对象属性。get设置读取,set设置写入。
var person = {
name:"Mirage",
get age(){
return age;
},
set age(val){
if(val < 0 || isNaN(val) || val > 150){
age = 18;
}else{
age = val;
}
}
}
person.age = -99;
console.log(person.age); //输出 18
age的值可以在set中做判断,同样也可以在get中做判断。
var person = {
name:"Mirage",
get age(){
if(age < 0 || isNaN(age) || age > 150){
return 18;
}else{
return age
}
},
set age(val){
age = val;
}
}
person.age = -99;
console.log(person.age); //输出 18
可以通过get/set对特定属性设置只读或不可读
var player = {
get gameYear(){
return 5;
}
}
player.gameYear = 59;
console.log(player.gameYear); //输出5
仅设置get返回值,该属性就不可修改(只读)。
var player = {
set age(val){
if(val < 0 || isNaN(val) || val > 150){
age = 18;
}else{
age = val;
}
}
}
player.age = "age"; //player.pName值为18
console.log(player.age); //输出 undefined
仅设置set,该属性可修改,但不可读取。
*****************************************************************************************************************
原型链的get/set
对构造器创建的对象设置get/set属性需要用到 Object.defineProperty 。
Object.defineProPerty函数可以添加对象属性,并修改现有属性的特性。
Object.definePerperty参数:
object(必):目标对象(也可为对象原型添加,还可为DOM对象)。type:ObjectName(对象名)。
propertyname(必):属性名。type:string(字符串)。
descriptor(必):属性描述器。type:Object(对象_字面量)。
function person(){}
Object.defineProperty(person.prototype,
"age",
{
get:function(){
return age;
},
set:function(val){
if(val < 0 || isNaN(val) || val > 150){
age = 18;
}else{
age = val;
}
}
});
var p1 = new person();
p1.age = 6150;
console.log(p1.age); //输出 18。
通过defineProperty可以对对象原型属性进行修改。
js之oop <二> 对象属性的更多相关文章
- js之oop <五>对象序列化(js的JSON操作)
js对象序列化的过程,就是对象转换为JSON的过程.JSON.stringify() 将对象序列化成JSON.(接收对象,输出字符串) var obj = {x:2,y:3}; var str = J ...
- 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作
页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...
- 原来JS是这样的 - 对象属性
引子 在上一篇(原来JS是这样的 (2))刚发布的时候就阅读了那篇文章的人可能会注意到那篇曾用过"JavaScript 中万物皆对象"的说法,而在随后我发现错误后立即更新改掉了这个 ...
- JS中delete删除对象属性
1.删除对象属性 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm ...
- JS delete 用法(删除对象属性及变量)
1,对象属性删除 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm delete ...
- js delete可以删除对象属性及变量
,对象属性删除 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm delete o ...
- js知识梳理2:对象属性的操作
1.属性的查询和设置 ①基本语法 这个简单,可以通过点(.)或方括号([])运算来获取属性的值,注意点运算符后的标识符不能是保留字,方括号内的表达式必须返回字符串或返回一个可以转换成字符串的值. va ...
- js精要之对象属性
// 对象的应用解除 将对象变量置为null(在写插件多大型项目是不要忘记解除对象占用) var object1 = new Object(); var object2 = object1; // 对 ...
- js之oop <四>对象管理
对象扩展管理 Object.isExtensible() 检测对象是否可扩展(一般返回true).Object.preventExtensions() 防止对象扩展. var p = {p1:&quo ...
随机推荐
- 前后端分离开发——模拟数据mock.js
mock.js 生成模拟数据,拦截ajax请求 <script type="text/javascript" src="http://libs.baidu.com/ ...
- CSS 中的内联元素、块级元素以及display的各个属性的特点
CSS的内联元素和块级元素 块级元素<h1>-<h6>.p.dt是不可以内联块级元素的 1.block和inline这两个概念是简略的说法,完整确切的说应该是 block-le ...
- MVC模式--DropDownList数据绑定
DropDownList数据绑定 在控制器中Controller中,为前台页面DropDownList准备的数据 List<bookInfo> bookList = bookManger. ...
- JQuery data API实现代码分析
JQuery data 接口是什么? .data() Store arbitrary data associated with the matched elements or return the v ...
- RDIFramework.NET ━ 9.8 用户权限管理 ━ Web部分
RDIFramework.NET ━ .NET快速信息化系统开发框架 9.8 用户权限管理 -Web部分 在实际应用中我们会发现,权限控制会经常变动,如:需要调整角色的分配,需要收回与授予某些角色.用 ...
- SQL-乐观锁,悲观锁之于并发
每次写博客,第一句话都是这样的:程序员很苦逼,除了会写程序,还得会写博客!当然,希望将来的一天,某位老板看到此博客,给你的程序员职工加点薪资吧!因为程序员的世界除了苦逼就是沉默.我眼中的程序员大多都不 ...
- Information
\\server01DESKTOP-RE5QEBU\pqpqlabs\\fileserverpansq@sh.pqlabs.comP1q2w3e
- Openstack的web管理端相关
openstack的web管理端技术方面要关注的问题. 同步?异步 先说浏览器的同步和异步,我们知道的浏览器可以使用ajax实现异步请求,就是浏览器在请求数据的时候,我们管理员还能对浏览器就行其他操作 ...
- 生产者-消费者问题【Java实现】
生产者-消费者问题是经典的并发问题, 非常适合并发入门的编程练习. 生产者-消费者问题是指, 有若干个生产者和若干个消费者并发地读写一个或多个共享存储空间:生产者创建对象并放入到共享存储空间,消费 ...
- python入门练习题2
1,制作表格 循环提示用户输入:用户名,密码,邮箱(要求用户输入的长度超过20个字符,如果超过则只有前20个字符有效) 如果用户输入q或Q就退出程序,将用户输入的内容以表格形式显示 user_inpu ...