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 <二> 对象属性的更多相关文章

  1. js之oop <五>对象序列化(js的JSON操作)

    js对象序列化的过程,就是对象转换为JSON的过程.JSON.stringify() 将对象序列化成JSON.(接收对象,输出字符串) var obj = {x:2,y:3}; var str = J ...

  2. 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作

    页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...

  3. 原来JS是这样的 - 对象属性

    引子 在上一篇(原来JS是这样的 (2))刚发布的时候就阅读了那篇文章的人可能会注意到那篇曾用过"JavaScript 中万物皆对象"的说法,而在随后我发现错误后立即更新改掉了这个 ...

  4. JS中delete删除对象属性

    1.删除对象属性 function fun(){   this.name = 'mm';   }   var obj = new fun();   console.log(obj.name);//mm ...

  5. JS delete 用法(删除对象属性及变量)

    1,对象属性删除 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm delete ...

  6. js delete可以删除对象属性及变量

    ,对象属性删除 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm delete o ...

  7. js知识梳理2:对象属性的操作

    1.属性的查询和设置 ①基本语法 这个简单,可以通过点(.)或方括号([])运算来获取属性的值,注意点运算符后的标识符不能是保留字,方括号内的表达式必须返回字符串或返回一个可以转换成字符串的值. va ...

  8. js精要之对象属性

    // 对象的应用解除 将对象变量置为null(在写插件多大型项目是不要忘记解除对象占用) var object1 = new Object(); var object2 = object1; // 对 ...

  9. js之oop <四>对象管理

    对象扩展管理 Object.isExtensible() 检测对象是否可扩展(一般返回true).Object.preventExtensions() 防止对象扩展. var p = {p1:&quo ...

随机推荐

  1. Android如何连接MySQL数据库

    Android开发中,大多数连接到远程MySQL数据库的方法是加入特定的Service到代码中.由于MySQL通常是和PHP一起使用的,最简单以及最常见的方法是写PHP脚本管理数据连接,以及从Andr ...

  2. 【Android测试】【第十七节】Instrumentation——App任你摆布(反射技术的引入)

    ◆版权声明:本文出自胖喵~的博客,转载必须注明出处.  转载请注明出处:http://www.cnblogs.com/by-dream/p/5569844.html 前言 学习了上节之后,大家是否已经 ...

  3. WordPress基础:极简安装教程

    1.下载WordPress 2.将解压后的文件夹,放到网站根目录,并重命名为你喜欢的目录如:w, 3.重命名文件wp-config-sample.php 为 wp-config.php,并进行配置 4 ...

  4. maven说

    maven打包命令:mvn assembly:assembly 打包成jar包需要修改配置把unpack改成false文件在: C:\Users\Administrator\.m2\repositor ...

  5. 怎样将BigDecimal转换成Int

    BigDecimal a=new BigDecimal(12.88); int b=a.intValue(); System.out.println(b);//b=12;

  6. LeetCode Burst Balloons

    原题链接在这里:https://leetcode.com/problems/burst-balloons/ 题目: Given n balloons, indexed from 0 to n-1. E ...

  7. RDIFramework.NET ━ 9.15 个性化设置 ━ Web部分

    RDIFramework.NET ━ .NET快速信息化系统开发框架 9.15  个性化设置 -Web部分 个性化设置,主要针对用户的偏好对界面进行设置,主界面如下: 9.15.1界面皮肤设置 目前框 ...

  8. Java基础之在窗口中绘图——填充星型(StarApplet 2 filled stars)

    Applet程序. import javax.swing.*; import java.awt.*; import java.awt.geom.GeneralPath; @SuppressWarnin ...

  9. Asp.Net alert 方法

    public static void ExcuteAlert(Page page, string strAlerts)        {            ClientScriptManager  ...

  10. paper 100:何恺明经典去雾算法

    一:由简至美的最佳论文(作者:何恺明  视觉计算组) [视觉机器人:个人感觉学习他的经典算法固然很重要,但是他的解决问题的思路也是非常值得我们学习的] 那是2009年4月24日的早上,我收到了一封不同 ...