为了账号安全,请及时绑定邮箱和手机立即绑定

无涯教程-Javascript - Objects(对象)

标签:
JavaScript

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

  • 封装      -  将相关信息存储在对象中。

  • 聚合      -  将一个对象存储在另一个对象中的函数。

  • 继承      - 一个类的某些属性和方法依赖于另一个类的函数。

  • 多态性  - 编写一种以多种不同方式工作的函数或方法。

对象由属性组成。如果属性包含函数,则将其视为对象的方法,否则视为属性。

对象属性

对象属性可以是三种原始数据类型中的任何一种,也可以是抽象数据类型中的任何一种,如另一个对象。对象属性通常是在对象的方法内部使用的变量,但也可以是在整个页面中使用的全局可见变量。

objectName.objectProperty=propertyValue;

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

var str=document.title;

对象方法

方法是让对象执行某项操作或让其完成某项操作的函数,函数和方法之间的区别很小-函数是语句的独立单元,并且方法附加到对象,并且可以通过 this 关键字引用。

以下是一个简单示例,展示了如何使用文档对象的 write()方法在文档上写入任何内容。

document.write("This is test");

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");

对象构造函数

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

该变量包含对新对象的引用。

请尝试以下示例,它演示了如何创建对象。

<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 ="Learnfk";
      </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 : Learnfk

本示例演示了如何使用用户定义的函数创建对象。这里的 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", "Learnfk");
         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 : Learnfk

定义对象方法

前面的示例演示了构造函数如何创建对象和分配属性,但是无涯教程需要通过为对象分配方法来完成其定义。

请尝试以下示例;它显示了如何与对象一起添加方法。

<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", "Learnfk");
         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 : Learnfk 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", "Learnfk");
         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 : Learnfk Book price is : 100

Native对象

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

这是所有重要的 JavaScript native对象:

  • JavaScript Number 对象

  • JavaScript Boolean 对象

  • JavaScript String 对象

  • JavaScript Array 对象

  • JavaScript Date 对象

  • JavaScript Math 对象

  • JavaScript RegExp 对象

参考链接

https://www.learnfk.com/javascript/javascript-objects.html

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消