JavaScript对象

最新推荐文章于 2025-02-12 20:52:58 发布

原创最新推荐文章于 2025-02-12 20:52:58 发布 · 218 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

33 篇文章

订阅专栏

1.1 什么是对象？

对象：对象是具有类类型的变量。将一组数据(属性)和与这组数据有关操作(方法)组装在一起，形成一个实体，这个实体就是对象。对象是人们要进行研究的任何事，它不仅能表示具体的事物，还能表示抽象的规则、计划或事件。
对象的状态：对象中的数据，描述对象的信息。
对象的行为：对象中的各种操作，用来描述对象的功能，改变对象的状态。
对象实现了数据和操作的结合，使数据和操作封装于对象的统一体中。

1.2 对象的创建

类定义方法：function 类名(){}或类名=function(){}

如：function Person(){}或Person=function(){}

对象定义方法一：obj=new 类名;或obj=new 类名();

如person1=new Person;或person1=new Person();

对象定义方法二：

obj={};

js对象优势：可通过“对象.属性”的方式动态为对象添加属性；
如person1.name=“李四”;动态为person1添加name属性。

方法1：使用Object对象来定义对象

<title>使用Object自定义对象</title>
<script type="text/javascript">
var car = new Object();	//使用new关键字构造一个对象
car.name ="奔驰600";	//给car对象添加属性
car.color = "黑色";
car.pailiang =2.0;
car.run = canRun;  //添加canRun方法
function canRun(){
  document.write("<br>最高时速250公里");
}//或者使用下面的方式给car对象添加方法
//car.run=function(){ document.write ("<br>最高时速250公里");}
 //使用car对象的属性
 document.write("这是一辆"+car.name+"，颜色是"+car.color+"，排量"+car.pailiang);
 //调用car对象的方法
car.run(); 
</script>

方法2：使用自定义函数来定义对象

<title>使用function自定义对象</title>
<script type="text/javascript">
   function  Car(name,color,pailiang){
	this.name= name;  //声明name属性
	this.color = color ; //声明颜色属性
	this.pailiang = pailiang ;   //声明排量属性 
    this.run = canRun; //给Car对象添加方法
        //或者采用下面的方式给Car对象添加方法
        //this.run = function(){document.write("<br>最高时速250公里");}
         }
  function canRun(){
       document.write("<br>最高时速250公里");
  }
</script>    
</head>
<body>
<script type="text/javascript">
   var car = new Car("奔驰600","黑色",2.0);  //构造car对象
   document.write("这是一辆"+car.name+"，颜色是"+car.color+"，排量是"+car.pailiang+"升");
   car.run(); //调用对象的方法
</script>
</body>
</html>

1.3 对象的属性及其使用

（1）通过圆点(.)运算符。语法：对象名.属性名
（2）通过属性名。语法：对象名[“属性名”]
（3）通过循环语句。
语法：for(var 变量 in 对象变量){…对象变量[变量]…}
（4）通过with语句。可以方便地用来引用某个特定对象中已有的属性，但是不能用来给对象添加属性。要给对象创建新的属性，必须明确地引用该对象。
语法：with(对象变量){ 直接使用对象的属性名 }

<title>使用对象的属性</title>
<script type="text/javascript">
//1.通过对象名.属性名使用对象的属性
function Student(name,age){
  this.gender="male";
  this.kind=true;
  this.rich=true;
  this.name="奥巴马";
  this.age=30;
}
var stu1=new Student("charming",25);
alert(stu1.kind);     //true
alert(stu1[kind]);
stu1.gender;
//当使用document.kind的时候，解释器会误以为stu1下有一个kind的字段，因此可以使用stu1[kind]来进行访问。通常来说，我们在开发通用的工具包时，应该对用户可能的输入不做任何假设，通过[属性名]这种形式则总是 可以保证正确性的。
//2.对象名["属性名"]使用对象的属性
function fun(){
  var a=document.forms["myform"].elements["myinput"].value;
  alert(a);
}
//3.for...in循环语句使用对象的属性
var mycars=new Array("Saab","Volvo","BMW");
for (var x in mycars){
  document.write(mycars[x] + "<br />")
}
var stu2=new Student("詹姆斯",32);
with(stu2) {
    var str ="姓名: "+name+"<br>";
    str+= "年龄："+age+"<br>";
    str+= "性别："+gender;
    document.write(str);
}
</script>
</head>

<body>
<form name="myform" action="#" method="post">
<input type="text" name="myinput" value="" id="myinput"/>
<input type="button" name="button" value="提交" id="button" onclick="fun()"/>
</form>
</body>
</html>

说明：使用对象的属性的两种固定方法：".“和”[ ]"方括号，前者用于访问标准的对象属性，后者用于访问由页面定义的对象属性。区别如下：
document.forms[“myform”].elements[“myinput”].value这里，forms、elements和value是document的一个标准属性，而表单名 myform和myinput则是由页面所定义的
如果一个属性名在执行产生，方括号是必须，如果有“value1″, ”value2″,和 “value3”这样的属性，并且想利用变量 i=2来访问，
后种方法可以运行：

MyObject["value"+i]

而前种方法这个不可以：

MyObject.value+i

1.4 对象的方法及其使用

1）使用with语句。
语法：

with(对象变量){
直接使用对象的方法名
}

提示：with 语句是运行缓慢的代码块，尤其是在已设置了属性值时。大多数情况下，如果可能，最好避免使用它。
（2）通过圆点(.)运算符就可以得到对象的方法。
语法：对象变量.对象方法名()；

<title>使用对象的方法</title>
<script type="text/javascript">

//1.通过对象名.方法名使用对象的方法

function Student(name,age){
  this.gender="male";
  this.kind=true;
  this.rich=true;
  this.name=name;
  this.age=age;
  this.playBall=function(){
	 alert(name+" 十大扣篮"); 
  }
}
var stu1=new Student("勒布朗•詹姆斯",25);
alert(stu1.kind);     //true
alert(stu1["kind"]);
stu1.playBall();

//2.通过with语句

var s="Hello classMates";
with(s) {
  alert(toUpperCase());	
}
</script>
</head>

2 内置对象框架及基类对象

2.1 内置对象框架

Object是基类，可以和java.lang.Object相当。
js基础类库中的类都包含些静态方法，可以直接提供类名.方式进行引用使用。
数据类型都可以生成对象。内置框架如下图所示：
在这里插入图片描述

2.2 内置对象的基本属性和方法

在这里插入图片描述
（1）prototype属性
该属性可以为对象添加属性和方法。
语法：object.prototype.name=value
object：对象名或字符变量名。
Name：要添加的属性名。
Value：添加属性的值。

（2）constructor属性
该属性用于对当前对象的函数的引用。
语法：Object.constructor
Object：对象名或字符串变量名。
杂对象的类型，typeof做不到。
（3）toString()方法
用法：可把一个对象转换为一个字符串，并返回结果。
语法：Object.toString(radix)
参数：radix可选。Object可以是String、Array、Date、Boolean和Number对象中的任何一种对象。如果是Object是Number对象，那么radix规定表示数字的基数，是2~36之间的整数。若省略，则使用基数10。但要注意，如果该参数是10以外的其他值，则ECMAScript标准允许实现返回任意值。
返回值：数字的字符串表示。例如，当 radix为2时，Object会被转换为二进制值表示的字符串。
抛出：当调用该方法的Object不是对象时抛出 TypeError异常。
（4）toLovcalString()方法
用法：把一个Number对象转换为本地格式的字符串
语法：Object.toLocaleString()
参数：Object可以是String、Array、Date、Boolean和Number对象中的任何一种对象。
返回值：字符串表示，由实现决定，根据本地规范进行格式化，可能影响到小数点或千分位分隔符采用的标点符号。
抛出：当调用该方法的Object不是时抛出 TypeError异常。
（5）valueOf ()方法
用法：以字符串形式返回对象的值。
语法： Object. valueOf()
参数：Object可以是String、Array、Date、Boolean和Number对象中的任何一种对象。
返回值：返回对象的原始数值
抛出：当调用该方法的Object不是对象时，抛出TypeError异常。