文档章节

javascript对象---5 Object全局内置函数

奋斗的小芋头
 奋斗的小芋头
发布于 2016/11/27 00:09
字数 1451
阅读 11
收藏 1

Object全局内置函数:如下函数都是ECMASCRIP5中扩展的,不是所有浏览器都能兼容。

defineProperty(obj.filedName. configObj):  1.定义对象的数据属性。 2.定义对象访问器属性。

一. 定义一个对象的数据属性

var cat = {
                name :"tom"
            }
            //未 限制之前可以修改name
            cat.name="jerry";
            console.log(cat.name);  

-------输出   jerry

 

defineProperty(  你要限制的对象  ,要限制对象的哪一个属性,( 对于属性的配置){

value : "  "   //属性值

writable : false/true  //是否可写可修改

enumerable : false /true  // forin是否可遍历

configerable : false/true   //是否可以重新配置属性

}

 

1. 利用  defineProperty 修改对象的值

Object.defineProperty( cat, "name" ,{
                value: "jerry"
   })
 console.log(cat.name);

结果----jerry

2. writable   是否可以修改  可以定义程序全局变量不可修改

Object.defineProperty( cat, "name" ,{
                value: "jerry" ,
                writable : true,  // 当前属性是否可以修改
            })
            
            cat.name="miaomiao";  //重新修改name的值
            console.log(cat.name)

结果--------miaomiao

Object.defineProperty( cat, "name" ,{
                value: "jerry" ,  //修改name值
                writable :  false,  // 当前属性是否可以修改
            })
            
            cat.name="miaomiao";  //不可以继续修改name的值 --不报错但不修改
            console.log(cat.name)

结果--------jerry

3.用法 : 定义常量

var Math1 = {

PI : 3.1415926

}

Object.defineProperty( Math1 , ' PI', {

writable :false          //后面不加分号 加逗号 ,是一个对象

})

Math1.PI =3 ; //保证 不被修改

4. enumerable : 是否可以在 for - in循环中访问到

Object.defineProperty( cat, "name" ,{
                value: "jerry" ,
                writable : true,    // 当前属性是否可以修改
                enumerable: true, // 是否在 for - in循环中访问到

            })
            for( var i in cat ){               //获取对象中所有属性名属性值    i 属性名
                console.log(i+"的值为" + cat[i]); //属性名

            }

结果----------

如果将  enumerable 设为 false 则不能访问 name

结果-i-----

name 的值为 jerry   (没有name值)

5.configerable  //是否可以重新配置

6.使用 delete cat.name; 可以删除对象的属性

delete cat.age ;

 alert(cdat.age) ;   // undefined

二 .判断数据合理性 age不能到2200   定义对象访问器属性

1.定义对象访问器属性的作用:

数据封装,把属性信息隐藏, 只能根据开发者提供的get.、set方法访问属性信息(get、set方法可以不同时存在)

//数据的访问器属性
            var cat ={
                name :"",
                _age : "",
            };
            //在内存中可以看到 age 但访问不了,只能由 get set 方法访问   深层封装  _age
            Object.defineProperty( cat, "age", {            //定义的是age属性  不是_age 
                enumerable :true,
                configerable:true,
                get : function(){

                   alert("get");
                    return this . _age;     //赋值给age
                },
                set : function(newValue){      //设置规则

                    alert("set");
                    if(newValue >=200){
                        alert("年龄过大")
                    }else{
                        this._age = newValue; //会出现死循环  一给 this.age赋值久调用set 不能用age  所以设不同的 _age 值,将_age封装起来, 返回age
                    }
                }
                
            })
            //在访问person.age会调用get方法,set方法  不能直接访问属性,只能通过get 方法,起到封装的作用
            cat.age=300;     //年龄过大

alert(cat.age) ;----调用的是get方法   defineProperty中的属性

1.弹出---------set

2.弹出---------年龄过大--------- 没有赋值

3、弹出---------get  -----return  空值

4.弹出-----------空(没有赋值)

cat.age=100;

alert(cat.age)

1.弹出---------set

2.弹出---------get

3.弹出---------100

三.定义对象访问器属性的作用:

数据封装,把属性信息隐藏,只能根据开发者提供的 get set  方法访问属性信息(get、set方法可以不同时存在)  给属性赋值时会调用 set  方法

四.访问器属性的注意事项:

在定义set方法时只要执行属性赋值,this.age = newValue, 就会造成死循环,每次给this.age赋值又会调用this.age ,因此按照习惯在对象属性前加 _。

定义时 _age: ” “           设置属性时:    Object.defineProperty( cat, "age",  {}) 

调用时 ===》 cat . age( 不直接调用在对象中定义的属性)

四、使用Object.defineProperties 为一个对象的多个属性,进行 数据访问器属性  的赋值

Object.defineProperties( 对象 ,{ 配置})

var cat ={
                name :"",
                _age : "",
            };

Object.defineProperties( cat, {
                name:{
                    value :"Tom",
                } 
,
                
                _age : {
                    value : 0,
                    writable :false        
//不可修改
                } ,
                
                age :{                   //访问器属性
                        
                      
 get : function(){
                            console.log("get");
                            return this._age;
                    },
                  
 set : function(newValue){ //设置规则
                            console.log("set")
                            if(newValue >=200){
                              console.log("年龄过大");
                        }else{
                            console.log("赋值")
                            this._age = newValue; //会出现死循环  一给 this.age赋值久调用set 所以 _age
                        }
                    }
                }

            })
            
            console.log(cat.name);
            console.log(cat.age) ;

结果:

Tom

get

0

如果改为 给age赋值 ---不会改变因为 _age的writable :false

cat.age=100;
            console.log(cat.name);
            console.log(cat.age) ;

//结果为

set

赋值

Tom

get

0

五. Object全局内置函数

Object.getOwnPropertyDescriptor( Obj,field) :(对象 , 属性)  获取对象属性的 访问器,或 数值属性

    var cat ={
                name :"",
                _age : "",
            };
            
            Object.defineProperties( cat, {
                name:{
                    value :"Tom",
                },
                
                _age : {
                    value : 0,
                    writable :false
                },
                
                age :{
                        
                        get : function(){
                        console.log("get");
                        return this._age;
                    },
                    set : function(newValue){ //设置规则
                        console.log("set")
                        if(newValue >=200){
                            console.log("年龄过大");
                        }else{
                            console.log("赋值")
                            this._age = newValue; //会出现死循环  一给 this.age赋值久调用set 所以 _age
                        }
                    }
                }
            })
            
            var obj = Object.getOwnPropertyDescriptor( cat, "name");   (对象 , 属性)
            debugger  //到这后跟踪 obj

属性的默认值为 true

 

2,Object.getOwnPropertyDescriptor :获取对象所有属性名,不包括 prototy中属性。

var names = Object.getOwnPropertyNames(cat); //
  debugger  //到这后跟踪 names

”_age“ 也在内存中,但一看就知道是一个封装属性

3.  Object.keys(cat)   获取对象所有枚举的属性名,不包括 prototy中属性。

var keys = Object.keys(cat); 
            debugger 

如果给age中设置enumerable :true, age也出现

4 .Object.preventExtensions(对象)   锁住对象属性,使其不能拓展,也就是不能增加新的属性,原有的属性值仍然可以更改,可以删除。

可扩展对象 cat.jiao = "miao"  --可以扩展

但如果

Object.preventExtensions(cat);

cat.jiao = "miao"

8.

则对象扩展不执行

5.  Object.isExtensible(cat);  用于判断对象是否可被拓展,返回true false

6. Object.seal(cat)  让对象既不可以拓展也不可以删除属性,属性值可以修改

7.Object.isSealed(cat); //判断对象是否被密封

8.Object全局内置函数

Object.freeze( obj ) :完全冻结对象,在seal基础上,属性值也不可以修改

Object. isFrozen( obj )是否完全冻结

© 著作权归作者所有

共有 人打赏支持
奋斗的小芋头
粉丝 1
博文 161
码字总数 129345
作品 0
大连
私信 提问
javascript模式 读书笔记一

第一章 简介 模式 模式是指一个通用问题的解决方案。 模式分三种 设计模式 编码模式:javascript特有的 反模式:常见的 引发的问题比解决的问题更多的一种方法。 JavaScript:基本概念 面向对...

lilugirl
2014/01/21
0
1
JavaScript 基础--- (运算符/数组/函数/变量)

基本概念: 1.javascript的组成:三部分组成 (1)ECMAScript - ECMA : 欧洲计算机协会 - 有ECMA组织制定的js的语法,语句..... (2)BOM: - broswer object model: 浏览器对象模型 (3)D...

姜白告
2018/07/30
0
0
(转)JavaScript对象模型-执行模型

转贴一篇讲Javascript的文章,文章写的很好! 原文http://blog.csdn.net/wu9xia/archive/2008/04/28/2339952.aspx 数据类型 基本数据类型 基本数据类型是JS语言最底层的实现。 简单数值类型:...

Huawu
2010/07/27
0
0
JavaScript Gerden概述

1.对象 1.1 对象使用和属性 JavaScript中所有变量都是对象,除了null和undefined 1.2 对象作为数据类型 JavaScript对象可以作为哈希表使用,主要用来保存命名的键和值的对应关系 1.3 访问属性...

Seven_7
2014/07/29
0
0
JavaScript对象模型-执行模型

数据类型 基本数据类型 基本数据类型是JS语言最底层的实现。 简单数值类型: 有Undefined, Null, Boolean, Number和String。注意,描述中的英文单词在这里仅指数据类型的名称,并不特指JS的全...

长平狐
2013/01/06
35
0

没有更多内容

加载失败,请刷新页面

加载更多

React SSR样式及SEO的实践

前一篇主要记录了一下SSR配置以及结合Redux的使用。这里简单说一下React SSR中样式处理和更优雅的SEO SSR样式 在React客户端渲染,添加样式很容易。写一个css样式文件,在对应组件中引用。标...

前端小攻略
27分钟前
4
0
华为手机太猛!余承东吹的牛今天都实现了

华为是世界上少有的在2B和2C领域同时取得成功公司。如今,华为消费者业务的营收,已经在华为总营收中占据“半壁江山”。 12月27日,华为董事长郭平在新年致辞中披露,预计2018年华为预计实现...

linux-tao
38分钟前
4
0
JSP的Model2模式

整体可以看做是 Request > Control > ( Service > DAO > POJO ) > Response POJO是数据实体类,最佳实践是与数据库物理表相对应,方便用工具进行生成,也易于理解。由于直接与物理表相对应...

max佩恩
46分钟前
2
0
rabbitMQ的使用

RabbitMQ介绍 RabbitMQ是实现AMQP(高级消息队列协议)的消息中间件的一种。 AMQP,即Advanced Message Queuing Protocol,高级消息队列协议,是应用层协议的一个开放标准,为面向消息的中间...

狼王黄师傅
51分钟前
1
0
面向对象继承

第1章 面向对象 1.1 知识回顾 1.Java中的数据类型 2.引用数据类型String中的方法 3.IO流_读写文件 1.2 面向对象概念回顾 什么叫面向对象编程?有人是这么理解的 也有人说不对,面向对象编程是你...

stars永恒
58分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部