js数据类型中的对象

  • 对象是JavaScript的核心概念之一,也是最常用的数据类型,即引用型数据。
  • 若特性的值存放的是原始值或对象的引用,这种特性称为对象的属性。
  • 若特性的值存放的是函数,这种特性称为对象的方法。
  • 对象是具有属性方法的特殊数据类型。
  • JavaScript中除了string、number、boolean、null、undefined之外,其它的数据都是对象。

JavaScript中对象类型

  • 本地对象:由ECMAScript规范定义,独立于宿主环境的对象
  • 宿主对象:由JavaScript解释器所嵌入的宿主环境定义的
  • 自定义对象:由运行中的JavaScript代码创建的对象

JavaScript是基于对象的语言,JS中没有定义类(class)的语法,也不会通过类创建对象,JavaScript基于对象,而不是基于类。

(1)创建对象

1、使用对象

语法:

var o=new Object();
        o.maintitle="javaScript";
        o.subtitle="programming";
        o.page=360;
        o.price=50;
        o.show=function(){
            return o.maintitle+o.subtitle+o.page+o.price;
        }

2、使用对象直接量创建对象:最直接、最高效、最简便的方法

语法:

var  objectName={
           属性名1  :  值1 ,
           属性名2  :  值2 ,
           ……
           };

objectName:任意形式的字符串或是JavaScript中的标识符
*:属性值可以是任意类型的数据
属性与属性之间通过逗号分隔,最后一个属性末尾不需要逗号

如果不包含任何属性,则可以定义一个空对象
例:

var book={
   “main title”:“JavaScript”,
   “sub-title”: “ Programming”,
   “pages”:360,
   “price”:50
};

若属性名包含空格、连字符、关键字、保留字等内容时,必须使用字符串
注意:变量名不能使用字符串表示,在构造函数体内也不能使用字符串标签来命名属性名,此时的属性名是合法的标识符。

var o=function(){
   this.a=1;
   this.b=true;
};

如果属性值是函数,则该属性就变成对象的方法。

var o={
   a:function(){   //属性值为函数
       return 1;
   }
};
alert(o.a());      //附加小括号读取属性值,即调用方法

如果属性值是对象,则可以设计嵌套结构的对象。

var o={
  a:{   //属性值为对象
      b:1
  }
};
alert(o.a.b);    //连续使用点号运算符读取内层对象的属性值

如果属性值是数组。

var o={
   a:[1,2,3]    //属性值为数组
};
alert(o.a[0]);   //使用下标读取属性包含的元素值

3、使用函数创建对象

语法:

function book2(maintitle,subtitle,page,price){
          var o=new Object();
          o.maintitle=maintitle;
          o.subtitle=subtitle;
          o.page=page;
          o.price=price;
          o.show=function(){
           return aintitle+o.subtitle+o.page+o.price;
               }
               return o; 
          }
var book2=book2("js","programming",60,30);

4、使用构造函数创建对象

使用new运算符调用函数来构造一个实例对象。
语法:

var  objectName=new functionName(args);

objectName:构造的实例对象名称
functionName:构造函数名称,用来创建和初始化一个新的对象,任何一个函数都可以作为构造函数。构造函数函数体内可使用this指代 objectName实例对象
args:参数列表
例1:

function MyFun(w,h){
    this.w=w;   //构造函数的成员
    this.h=h;   //构造函数的成员
}
var myfun=new MyFun(4,5);  //实例并初始化构造函数

当使用new运算符调用构造方法时,JavaScript会自动创建一个空白的对象,然后把这空白对象传递给this关键字,作为它的引用值。这样,this就成为新创建对象的引用指针,然后在构造函数结构体内,通过this赋值定义实例对象的属性。
例2:

function Book(title,pages){
    this.title=title; 
    this.pages=pages;
    this.display=function(){
        alert(this.title+this.pages);
    }
}
var book1=new Book(“JavaScript程序设计”,160);
var book2=new Book(“C语言程序设计”,350);

5、使用create()方法创建对象:

ECMAScript5为Object新增了一个静态方法Object.create(),直接调用该方法可以快速创建一个新对象。
作用:创建一个具有指定原型且可选择性包含指定属性的对象。
原型对象

  • 原型实际上就是一个数据集合,即普通对象,继承于Object,由JavaScript自动创建并依附于每个构造函数。
  • 在构造函数中包含一个prototype属性,该属性指向JavaScript为构造函数创建的原型对象,实例对象通过prototype关键字可以访问原型,实现JavaScript原型继承机制。
  • 通过对象直接量创建的对象都具有同一个原型对象:Object.prototype,对象直接量的constructor属性将指向Object的构造函数。通过new Object()创建的对象也继承自Object.prototype。
  • Object.prototype没有原型,不继承任何属性。
    使用create()方法创建对象:
    语法:
Object.create()(prototype,descriptors);

prototype:必须参数,要用做原型的对象,可以为null
descriptors:可选参数,包含一个或多个属性描述符的JavaScript对象
例:

var obj1=Object.create({x:1,y:2});
var obj2=Object.create(null);//创建一个没有原型的新对象,它不会继承任何东西,甚至不能包括基础方法。
  • 通过{}或new Object()创建的空对象,使用该方法需传入参数Object.prototype
var obj3=Object.create(Object.prototype);

任何对象都可以作为原型对象,可以通过任意原型对象创建新对象。

descriptors

  • value:
    writable:是否可修改属性值
    enumerable:是否可枚举属性
    configurable:是否可修改特性和删除属性
  • 如果未指定最后3个特性,则它们的值默认为false。
  • 只要检索或设置该值,访问器属性就会调用用户提供的函数,访问器属性描述符包含set(设置属性值的函数)特性get(返回属性值的函数)特性。
    例:
    var newObj=Object.create(null,{
        size:{
            value:"large",
            enumerable:true
        },
        shape:{
            value:"round",
            enumerable:true
        }
    });
    document.write(newObj.size+"<br />");
    document.write(newObj.shape+"<br />");
    document.write(Object.getPrototypeOf(newObj)+"<br />");

(2)访问对象成员

  • 对象属性:对象引用变量.属性名
  • 对象方法:对象引用变量.方法名称(实参列表)
  • 读取一个对象的某个属性时,首先查询该对象中是否存在该属性,不存在,将会在该对象的原型对象中查询该属性,若原型对象中也没有,则要继续查询原型对象的原型对象,直到找到该属性或查到一个原型是null的对象为止。
  • 当为对象的某一属性进行赋值时,如果对象已经具有该属性,则这个赋值操作只改变已有的该属性的值,如果对象中不存在该属性,则赋值操作会为该对象创建一个新的该属性。如果对象继承的属性中存在该属性,则继承的属性被新创建的同名属性覆盖。
    例:
    var obj={};
    obj.x=1;
    var p=Object.create(obj);
    p.y=2;
    var q=Object.create(p);
    q.z=3;
    var s=q.toString();
    var k=q.x+q.y;

(3)Object对象

  • 根据对象的继承机制,任何对象除了继承null以外,都继承自Object的原型对象,Object对象也继承自它的原型对象。
  • 属性:
    constructor:对创建对象的函数的引用(指针)。对于 Object 对象,该指针指向原始的 Object() 函数。
    prototype:对该对象的对象原型的引用。对于所有的对象,它默认返回 Object 对象的一个实例。
  • 方法:
    hasOwnProperty(property):判断对象是否有某个特定的属性(自己的非继承的)。必须用字符串指定该属性(例如:o.hasOwnProperty("name"))
    isPrototypeOf(object):判断该对象是否为另一个对象的原型。
    propertyIsEnumerable():判断给定的属性是否可以用 for...in 语句进行枚举。
    toString():返回对象的原始字符串表示。对于 Object 对象,ECMA-262 没有定义这个值,所以不同的 ECMAScript 实现具有不同的值。
    valueOf():返回最适合该对象的原始值。对于许多对象,该方法返回的值都与 toString() 的返回值相同。

(4)String对象

String对象是JavaScript提供的字符串处理对象,提供了对字符串进行处理的属性和方法,它是String原始类型的对象表示
创建String对象:
var strobject=new String(参数);
例:

var string1 = new String("3.1415926");
var string2 = new String("Welcome");
var string3 = new String(“哈哈哈~");

属性:
length:用于获取对象中字符的个数
prototype:几乎每个对象都有,用于扩展对象的属性和方法,但在一般的网页开发中,用的不多
方法:

对于String对象的大部分方法来说,都可以将字符串看作一个由单个字符所组成的字符的组合,每个字符具有一个索引(索引从0开始),表示该字符在字符串中的位置。

(5)Array对象

Array 对象用于在单个的变量中存储多个值。
创建Array对象:

new Array();
new Array(size);
new Array (element0, eLement1, ... , eLementn) ;

例:

var myArray1 = new Array();
var myArray2 = new Array(4);
var myArray3= new Array(“张三""男"20”");
var myArray4=[王五",”男""22'];

当数组中的元素也是一个数组时,就构成了二维数组,此时就需要使用两次中括号运算符来操作数组中的元素值。

var myArray1 = new Array(3);//创建数组对象myArray1 
myArray1[0]=“姓名";
myArray1[1]=“性别";
myArray1[2]=“年龄";
var myArray2= new Array(3);//创建数组对象myArray2
myArray2[0]=“张三";
myArray2[1]=“男";
myArray2[2] =“20";
var myArray3 = new Array(3);//创建数组对象myArray3
myArray3[0] =“李四";
myArray3[1]=“女";
myArray3[2]="19";
var myArray4= new Array(myArray1, myArray2, myArray3); //创建数组对象myArray4
for(var i=0;i<myArray4.length; i++}//r变量i用于控制行标
    for(var j=O:j<3;j++){//变量j用于控制列标
    document.write(myArray4[0][i]);
}

除了使用for循环结构和下标对数组中的元素进行操作外,JavaScript中还有一种特殊的for…in循环语句专门处理与数组和对象相关的循环操作。使用for…in循环语句可以对数组中的每一个元素进行操作,其语法格式如下:

for(变量in 对象){
    代码段
}

变量用于存储循环执行过程中对象的下一个元素,它将遍历数组中的每一个索引。如果变量值是一个合法的下标索引(即小于数组长度),就会执行代码段,否则将退出循环。
例:

var player Array = new Array(“刘备","关羽" ,张飞""赵云""马超";"黄盖""吕布");
for(var playerin playerArray){
    document.write(playerArray[player]);
}

属性:

方法:

(6)Date对象

Date 对象用于处理日期和时间。
创建Date对象:

var myDate=new Date();

注:Date对象会自动把当前日期和时间保存为其初始值。
例:

var myDate1 = new Date();
var myDate2 = new Date("24 October 2015");
var myDate3 = new Date(2008,7,8,20,08,08,08);

方法:


(7)Math对象

Math 对象用于执行数学任务
使用 Math 的属性和方法的语法:

var pi_value=Math.PI;
var sqrt_value=Math.sqrt(15);

Math 对象没有构造函数 Math(),因此Math对象不需要创建实例,使用Math之前,JavaScript会自动创建好Math对象,直接访问其属性或方法即可。
属性:Math对象的属性为数学中的常数值,只能读取,不能写入。通常情况下,只需在Math对象后加上一个圆点(.),然后写出要访问的属性名即可。

var myNumber1 =-16.16;var myNumber2 =-16.66;
document.write(Math.abs(myNumber1));
//输出值为16.16
document.write(Math.ceil( myNumber1));
//输出值为-16
document.write(Math.ceil( myNumber2));
//输出值为-16
document.write(Math.floor( myNumber1));
//输出值为17
document.write(Math.floor( myNumber2));
//输出值为17
document.write(Math.round( myNumber1));
//输出值为-16
document.write(Math.round( myNumber2));
//输出值为-17
var randomNumber=Math.floor(Math.random()*100+1)
//获得1~100的随机数

(7)Global 对象

目的是把所有全局方法集中在一个对象中,Global 对象从不直接使用,并且不能用 new 运算符创建。

  • escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串。
  • unescape() 函数可对通过 escape() 编码的字符串进行解码。
  • eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码。
  • isFinite() 函数用于检查其参数是否是无穷大。有限数字(或可转换为有限数字),那么返回 true。
  • sNaN() 函数用于检查其参数是否是非数字值。如果 x 是特殊的非数字值 NaN(或者能被转换为这样的值),返回的值就是 true
  • parseFloat() 函数可解析一个字符串,并返回一个浮点数。
  • parseInt() 函数可解析一个字符串,并返回一个整数。
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 222,183评论 6 516
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 94,850评论 3 399
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 168,766评论 0 361
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,854评论 1 299
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,871评论 6 398
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 52,457评论 1 311
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,999评论 3 422
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,914评论 0 277
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 46,465评论 1 319
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,543评论 3 342
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,675评论 1 353
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 36,354评论 5 351
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 42,029评论 3 335
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,514评论 0 25
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,616评论 1 274
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 49,091评论 3 378
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,685评论 2 360

推荐阅读更多精彩内容