- 对象是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() 函数可解析一个字符串,并返回一个整数。