• 对象是JavaScript的基本数据类型。简单的名值对组成了对象,BUT:还可以从一个被称为原型的对象继承属性,对象的方法通常就是继承的属性。

  • 对象最常见的用法有:创建、设置、查找、删除、检测、枚举它的属性。

  • 三类对象

    • 内置对象:Array Function Date RegExp
    • 宿主对象:HTMLElement对象
    • 自定义对象:由运行中的JavaScript代码创建的对象
  • 两大属性

    • 自有属性(own property)直接在对象中定义的属性
    • 继承属性(inherited property)从原型对象中继承的属性
  • 创建对象

    //简单的创建对象
    var o={};
    var o1={x:1,y:2};
    var o3={x:o1.x,y:o1.y+1};
    var o4={x:1,y:2,z:{x:3,y:4}};
    var books={
    "main title":"main title",
    ah:"jack",
    name:"name"
    };
    var o5= new Object();
    var o6=Object.create({x:1,y:2,z:function(){}});
    //通过原型继承创建一个新对象
    function inherit(p){
    if(p==null){
    throw TypeError();
    }
    if(Object.create){
    return Object.create(p);
    }else{
    var t= typeof(p);
    if(t!=="object" && t!== "function"){
    throw TypeError();
    }else{
    function f(){};
    f.prototype=p;
    return new f();
    }
    }
    }
    //通过继承设置对象的属性
    var o7=inherit(o6); //这里o7继承了o6
    o7.y=3;
    console.log(o7.y); //覆盖了继承的属性 3
    console.log(o6.y); //原型中的属性不变 2
    console.log(o7.x); //继承了原型的属性 1
  • 查询和设置属性

    var books={
    "main title":"main title",
    ah0:"Jack",
    ah1:"Dava",
    name:"name"
    };
    var title=books["main title"];
    var ah=books.ah;
    books.time="2017-05-01";
    books.ah="Dava";
    console.log(ah); //jack
    console.log(books.time);
    //var lens=books.subtitle.length; //这里会报错
    var len=books && books.subtitle && books.subtitle.length; //短路写法不报错
    console.log(len); //undefined
    //数组写法相对灵活
    var ah = "";
    for(var i=0;i<2;i++){
    ah +=books["ah"+i]+" ";
    }
    console.log(ah);
  • 删除属性

    //删除属性
    console.log(books.name);
    delete books["name"];
    delete books["main title"];
    console.log(books["main title"]);
    console.log(books.name);
    var x = 1;
    function f(){};
    delete f; //不能删除全局函数
    delete x; //不能删除var全局变量
    console.log(x);
    console.log(f);
  • 检测属性

    //检测属性
    var obj = {x:1};
    console.log("x" in obj); //不管继承的还是自有的 都返回true
    console.log(obj.x !== undefined); //同in方法,但不能区分x=undefined这种情况
    //常见的用法
    if(o.x!=null){} //如果o中含有x属性,且x的不是null和undefined
    if(o.x){} //如果o中含有x属性,且不是null、undefined、0、NaN、false。即o.x不能转换成false
    console.log(obj.hasOwnProperty("x")); //检测自有属性
    console.log(obj.propertyIsEnumerable("x")); //检测可枚举的自有属性
  • 枚举属性

    //枚举属性
    var o6={x:1,y:2,z:{x:1,y:2},f:function(){}};
    var o11 = inherit(o6);
    for(var p in o6){
    if(!o6.hasOwnProperty(p)) continue; //这里跳过继承的属性
    if(typeof o6[p]==="function") continue; //这里跳过方法
    console.log(p); //for in 方法遍历对象所有可枚举的属性 包括自有属性和继承属性
    }
    console.log(Object.keys(o6)); //返回一个数组,由对象中可枚举的自有属性的名称组成
    console.log(Object.getOwnPropertyNames(o6)); //返回一个数组,由对象中所有自有属性的名称组成
  • 属性getter和setter

    //属性getter和setter
    
                var v={
    Name:"吴琼",
    Age:28,
    set r(name){this.Name = name;},
    get r(){return this.Name;},
    set s(age){this.Age = age;},
    get s(){return this.Age;},
    get f(){return this.Age;}
    }
    //读取get
    console.log(v.Name); //吴琼
    console.log(v.Age); //
    console.log(v.r); //吴琼
    console.log(v.f); //
    //设置set
    v.r="张红";
    v.s=27;
    console.log(v.Name); //张红
    console.log(v.Age); //
    console.log(v.r); //张红
    console.log(v.f); //
  • 属性的特性

    //属性的特性:值value(get) 可写性writable(set)  可枚举性enumerable 可配置性configurable
    //得到自有属性的描述符,想要获得继承属性的描述符,需要遍历原型链Object.getPrototypeOf()
    //返回一个对象{value: "张红", writable: true, enumerable: true, configurable: true}
    //对不存在的属性和继承属性返回undefined
    console.log(Object.getOwnPropertyDescriptor(v,"Name"));
    //设置属性的描述符Object.defineProperty Object.defineProperties()
    Object.defineProperty(v,"Name",{value:"欧红",writable:true,numerable:false,configurable:true});
    Object.defineProperties(v,
    {
    "Name":{value:"欧红",writable:true,numerable:false,configurable:true},
    "Age":{value:18,writable:true,numerable:false,configurable:true}
    }
    );
    console.log(v.Name);
    console.log(v.Age);
    //不能随便修改属性的特性,必须遵循某些规则 如果属性是不可配置的

JavaScript的进阶之路(四)理解对象1的更多相关文章

  1. JavaScript学习笔记(十四)——对象

    在学习廖雪峰前辈的JavaScript教程中,遇到了一些需要注意的点,因此作为学习笔记列出来,提醒自己注意! 如果大家有需要,欢迎访问前辈的博客https://www.liaoxuefeng.com/ ...

  2. JavaScript的进阶之路(四)理解对象2

    对象的三个属性 原型属性 1.var v={}的原型是Object.prototype;继承了一个constructor属性指代Object()构造函数,实际的原型是constructor.proto ...

  3. JavaScript的进阶之路(六)理解函数

    函数:定义一次,多次调用:用于对象的属性则称为对象的方法:在JavaScript中,函数即对象:嵌套的函数形成闭包: 定义函数和简单调用函数: //函数定义 function f1(){ //没有参数 ...

  4. JavaScript的进阶之路(五)理解数组1

    数组是值得有序结合,每个值叫做一个元素,每个元素的位置称为索引,索引从0开始. 在JavaScript中,数组是对象的特殊形式.继承自Array.prototype中的属性,有丰富的数组操作方法. 通 ...

  5. JavaScript的进阶之路(五)理解数组2

    数组方法 //定义一个测试数组 var array1 = [1,2,5,null,"a"]; //join()方法是String.split()方法的逆操作,后者是将字符串分割成若 ...

  6. 深入理解javascript函数进阶系列第四篇——惰性函数

    前面的话 惰性函数表示函数执行的分支只会在函数第一次调用的时候执行,在第一次调用过程中,该函数会被覆盖为另一个按照合适方式执行的函数,这样任何对原函数的调用就不用再经过执行的分支了.本文将详细介绍惰性 ...

  7. JavaScript正则进阶之路——活学妙用奇淫正则表达式

    原文收录在我的 GitHub博客 (https://github.com/jawil/blog) ,喜欢的可以关注最新动态,大家一起多交流学习,共同进步,以学习者的身份写博客,记录点滴. 有些童鞋肯定 ...

  8. 《JavaScript高级程序设计》读书笔记 ---理解对象

    上一章曾经介绍过,创建自定义对象的最简单方式就是创建一个Object 的实例,然后再为它添加属性和方法,如下所示.var person = new Object();person.name = &qu ...

  9. JavaScript的进阶之路(七)客户端JavaScript知识点总结

    一.客户端JavaScript主要是BOM DOM的操作和js脚本的兼容性.互用性.可访问性.安全性的应用.以及一些框架的引用. 二.BOM:浏览器对象模型 主要介绍window对象 1.定时器:se ...

随机推荐

  1. Spring注入方式(1)

    Spring支持3种依赖注入方式,分别为属性注入.构造器注入和工厂方法注入(很少使用,不推荐),下面分别对属性注入和构造器注入详细讲解. 1.常量注入 属性注入是通过setter方法注入Bean的属性 ...

  2. C#-输入输出,类型,运算符,语句的练习——★判断年份是否是闰年★

    //输入一个年份,判断是否是闰年 //(能被4整除却不能被100整除的,年份世纪年份能被400整除的是闰年) Console.Write("请输入一个年份:"); int year ...

  3. python实现计算器功能

    import re def strip_operate(exp): # 合并多余的操作符 exp = exp.replace("+-", "-") exp = ...

  4. shiro学习笔记_0500_授权

    1,授权:给身份认证通过的人,授予他可以访问某些资源的权限. 2,权限粒度:分为粗粒度和细粒度. 粗粒度:例如对 user 的 crud,也就是通常所说的对表的操作. 细粒度:对表中记录的操作.如 只 ...

  5. 设置获取用户登录信息的Seeion类

    /** * * 保存用户上下文信息 * 还可以获取session * */ public class UserContext { public static final String USER_IN_ ...

  6. 之前为dd写的一个小的demo(robotium)

    测试类的编写: package com.m1905.dd.mobile; import com.robotium.solo.By; import com.robotium.solo.Solo; imp ...

  7. Windows Server 2003、2008、2012系统的安装

    说在前面的话 Windows Server 2003,和Windows XP十分相似,可以简单地认为Windows Server 2003是在Windows XP的基础上多了一些服务器管理和操作的功能 ...

  8. CentOS 6.4下安装JIRA6.3.6破解汉化

    JIRA产品非常完善且功能强大,安装配置简单,多语言支持.界面十分友好,和其他系统如CVS.Subversion(SVN).VSS.LDAP.邮件服务整合得相当好,文档齐全,可用性以及可扩展性方面都十 ...

  9. Jquery 在多个相同标签click的问题

    最近在做文章的删除动作,用Jquery来执行操作.但是实现时一开始总是只能对第一个起作用,其他的点击删除后没反应. 一开始的jquery代码是这样的, $('#articledelete').on(' ...

  10. MYSQL数据库的日志文件

    日志文件:用来记录MySQL实例对某种条件做出响应时写入的文件.如错误日志文件.二进制日志文件.慢查询日志文件.查询日志文件等. 错误日志 show variables like 'log_error ...