JavaScript 对象概述

JavaScript 对象概述

JavaScript 是一种面向对象编程(OOP)语言。如果编程语言为开发人员提供四种基本能力,则可以称之为面向对象的语言-

  • 封装 - 能够将相关信息(数据或方法)一起存储在对象中的能力。

  • 聚合 - 能够将一个对象存储在另一个对象内的能力。

  • 继承 - 类依赖于另一个类(或多个类)的属性和方法的能力。

  • 多态 - 能够以多种不同的方式编写一个函数或方法的能力。

对象由属性组成。如果属性包含一个函数,则被视为对象的方法;否则,该属性被视为属性。

对象属性

对象属性可以是三种基本数据类型之一,或者是另一个对象等抽象数据类型。对象属性通常是在对象的方法中内部使用的变量,但也可以是在整个页面中可见的全局变量。

向对象添加属性的语法为 –

objectName.objectProperty = propertyValue;

例如 - 以下代码使用 “title” 属性获取文档标题 document 对象。

var str = document.title;

对象方法

方法是让对象执行某些操作或对其执行某些操作的功能。函数和方法之间有一点小差异 – 函数是一个独立的语句单元,而方法附属在一个对象上,并可以通过 this 关键字调用。

方法可用于从屏幕上显示对象的内容到对一组局部属性和参数执行复杂的数学运算。

例如 - 下面是一个简单的示例,展示如何使用文档对象的 write() 方法在文档中编写任意内容。

document.write("This is test");

用户自定义对象

所有用户自定义对象和内置对象都是一个叫做 Object 的对象的子类。

new运算符

new 运算符用于创建一个对象实例。要创建一个对象,可以使用 new 后面跟着构造方法。

在下面的示例中,构造方法是Object(),Array()和Date()。这些构造方法是内置的JavaScript函数。

var employee = new Object();
var books = new Array("C++", "Perl", "Java");
var day = new Date("August 15, 1947");

Object()构造函数

构造函数是一个用来创建和初始化对象的函数。JavaScript提供了一个特殊的构造函数 Object() 来构建对象。 Object() 构造函数的返回值被赋给一个变量。

变量包含对新对象的引用。分配给对象的属性不是变量,并不使用 var 关键字定义。

示例1

尝试下面的示例,它演示了如何创建一个对象。

<html>
   <head>
      <title>User-defined objects</title>     
      <script type = "text/javascript">
         var book = new Object();   // Create the object
         book.subject = "Perl";     // Assign properties to the object
         book.author  = "Mohtashim";
      </script>      
   </head>

   <body>  
      <script type = "text/javascript">
         document.write("Book name is : " + book.subject + "<br>");
         document.write("Book author is : " + book.author + "<br>");
      </script>   
   </body>
</html>

输出

Book name is : Perl 
Book author is : Mohtashim

示例2

该示例演示了如何使用用户定义的函数创建一个对象。这里使用 this 关键字来引用传递给函数的对象。

<html>
   <head>   
   <title>User-defined objects</title>
      <script type = "text/javascript">
         function book(title, author) {
            this.title = title; 
            this.author  = author;
         }
      </script>      
   </head>

   <body>   
      <script type = "text/javascript">
         var myBook = new book("Perl", "Mohtashim");
         document.write("Book title is : " + myBook.title + "<br>");
         document.write("Book author is : " + myBook.author + "<br>");
      </script>      
   </body>
</html>

输出

Book title is : Perl 
Book author is : Mohtashim

为对象定义方法

前面的示例展示了构造函数如何创建对象并分配属性。但是我们需要通过为对象分配方法来完善对象的定义。

示例

尝试以下示例;它展示了如何在对象中添加一个函数。

<html>

   <head>
   <title>User-defined objects</title>
      <script type = "text/javascript">
         // Define a function which will work as a method
         function addPrice(amount) {
            this.price = amount; 
         }

         function book(title, author) {
            this.title = title;
            this.author  = author;
            this.addPrice = addPrice;  // Assign that method as property.
         }
      </script>      
   </head>

   <body>   
      <script type = "text/javascript">
         var myBook = new book("Perl", "Mohtashim");
         myBook.addPrice(100);

         document.write("Book title is : " + myBook.title + "<br>");
         document.write("Book author is : " + myBook.author + "<br>");
         document.write("Book price is : " + myBook.price + "<br>");
      </script>      
   </body>
</html>

输出

Book title is : Perl 
Book author is : Mohtashim 
Book price is : 100

‘with’关键字

‘with’ 关键字被用作一种简写方式,用于引用对象的属性或方法。

作为参数指定的对象成为接下来代码块的默认对象。可以在不命名对象的情况下使用对象的属性和方法。

语法

with对象的语法如下所示−

with (object) {
   properties used without the object name and dot
}

示例

尝试下面的示例。

<html>
   <head>
   <title>User-defined objects</title>   
      <script type = "text/javascript">
         // Define a function which will work as a method
         function addPrice(amount) {
            with(this) {
               price = amount;
            }
         }
         function book(title, author) {
            this.title = title;
            this.author = author;
            this.price = 0;
            this.addPrice = addPrice;  // Assign that method as property.
         }
      </script>      
   </head>

   <body>   
      <script type = "text/javascript">
         var myBook = new book("Perl", "Mohtashim");
         myBook.addPrice(100);

         document.write("Book title is : " + myBook.title + "<br>");
         document.write("Book author is : " + myBook.author + "<br>");
         document.write("Book price is : " + myBook.price + "<br>");
      </script>      
   </body>
</html>

输出

Book title is : Perl 
Book author is : Mohtashim 
Book price is : 100

JavaScript本地对象

JavaScript有几个内置或本地对象。这些对象可以在程序的任何地方访问,并且在任何操作系统中运行的任何浏览器中都能以相同的方式工作。

下面是所有重要的JavaScript本地对象的列表:

  • JavaScript Number对象

  • JavaScript Boolean对象

  • JavaScript String对象

  • JavaScript Array对象

  • JavaScript Date对象

  • JavaScript Math对象

  • JavaScript RegExp对象

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程