`
bufanliu
  • 浏览: 200597 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

JavaScript OOP

阅读更多
JavaScript的对象总有4类:
        脚本对象:如Object,Math,Date 等。
        浏览器对象:window,document,location等。
        Dom对象:对dom操作的对象,document,Node等
        自定义对象:程序员自身定义的对象。
   本次介绍程序员如何定义对象,对象是由类创建出来的,在Java中,我们可以通过语法:
     类 obj=new 类();
   来定义对象,那么在JavaScript中如何定义对象呢?
   在JavaScript中,我们首先讨论一下JavaScript的一个重要特性:动态性。
   JavaScript是一门动态语言,什么意思呢?我认为包含两个含义:
   一是任何变量都可以不用考虑数据类型,在运行时才能区分当前变量的数据类型,也就是说JavaScript是弱类型的,在声明变量

时,变量类型都是var ,不能是Object ,String,Date等。比如:
    var a=1;        //此时变量a是数字类型
    a="hello";      //此时变量a是字符串类型
    a=new Object(); 此时变量a是对象
    上面程序运行没有问题。
   
   动态性的第二个含义是对象属性可以在运行时,动态添加属性和方法,我们知道,在JavaScript中,任何对象都是Object的子类

。有如下示例:
   var obj=new Object();
   obj.name="Jerry";
   obj.sayHello=function ()
   {
      alert("Hello,world!");
   }
   alert(obj.name);
   obj.sayHello();
  
   我们在上面的代码里,动态的为一个对象obj添加一个属性name 和一个方法sayHello.

   在JavaScript中任何函数都可以new,例如:
   function Hello()
   {
        alert("Hello");
   }
   var h=new Hello();
   上面代码的解释是:创建一个对象h,对象没有任何属性和方法。在new一个函数时,函数的函数体自动执行,此时,函数体就犹如对象的构造方法。
   继续观察如下代码:
   function Hello()
   {
        var obj=new Object();
        obj.name="Jerry";
        return obj;
   }
   var h=new Hello();
   alert(h.name);
   输出Jerry;
   这时,对象h就是函数返回的Object对象,因此可以说,JavaScript通过  new 函数()  这样的语法来获取对象时,如果函数有return ,那么return 的结果就是实例化后的对象。
  
   另一方面,在JavaScript中,与java一样,任何对象都有内部关键字this ,表示当前对象,那么一个函数既然是对象的构造方法,能否这样使用呢?
   function Hello()
   {
        this.name="Jerry";
   }
   var h=new Hello();
   alert(h.name);
   运行结果与前面的一样,此时,该函数就与java中的类有点相似了,那么如何添加方法呢?可以这样:
   function Hello()
   {
        this.name="Jerry";
        this.sayHello=function()
        {
            alert("Hello,world");
        }
   }
   var h=new Hello();
   //alert(h.name);
   h.sayHello();
   OK,到此为止,类就定义出来了,接下来我们看看讨论一下JavaScript的封装,继承,多态。
   封装,不用说了,既然是类,那么天生就具备封装功能,只不过这里类的所有属性和方法都是public 的,这一点与java不一样。
   继承,就是扩展,在JavaScript中,任何时候都可以动态的给对象添加属性和方法,那么是不是就是继承呢?也可以这么理解:

   function SubHello()
   {
      var h=new Hello();
      h.age=20;
      return h;
   }
   var sub=new SubHello();
   sub.sayHello();
   alert(sub.age);
   我们可以看出,调用结果正常运行,可以说SubHello扩展了Hello,即相当于继承,但是这种继承方式感觉别扭,JavaScript给我们提供了一个关键字,prototype,就是原型的意思。先测试一下使用方法
   Hello.prototype.age=20;
   var h=new Hello();
   alert(h.age);
   运行结果正常20。
  
   封装为函数实现继承
   function SubHello()
   {
      Hello.prototype.age=20;
      return new Hello();
   }
   这就是说SubHello是从Hello继承过来,并且发生的扩展。

   接下来看看多态,多态形式是把子类对象赋值给父类的引用,但是在JavaScript中所有的对象都是var类型的,因此,JavaScript天生就是多态的,其实任何动态语言天生就是多态的,如Ruby.

   当然,JavaScript不支持方法重载,这一点非常重要。

   我们看看对象的应用。
   调用属性:
   var h=new Hello();
   alert(h.name);
   着非常简单。其实JavaScirpt对象就是属性和方法的集合,因此我们调用属性时可以这样调用:
    var h=new Hello();
    alert(h["name"]);
   并且对象动态添加属性时也可以这样:
   var h=new Hello();
   h["test"]=1234;
   alert(h.test);
   结果正常。
  
   调用方法:
   方法定义的时候可以是这样的
   var h=new Hello();
   h.testMethod=function()
   {
       alert("test");
   }
   可以看出,这个h的testMethod属性就是c语言中的函数指针,可以把方法进行赋值,方法名称就是方法的地址,因此还可以这样:
   function test(){
      alert("test");
    }
   h.testMethod=test;
   既然函数的名称就是函数的指针,当然和c语言一样不能对方法进行重载。那么如何传递参数呢?
   function test(a,b,c)
   {
      alert(a+b+c);
   }
   test(1,2,3);
   上面函数调用是正常的方法,那么下面的调用呢:
   test(1,2,3,4,5);
   当然也能正常运行,因为函数名是函数的唯一地址,那么参数4,5呢?丢失了吗?
   当函数传递参数时,所有的参数保存在JavaScirpt的内置对象arguments中,可以这样得到结果。
   function test()
   {
       if(arguments.length>=3)
       {
              return arguments[0]+arguments[1]+arguments[2];
       }
   }
   alert(test(1,2,3));
   这就是方法调用时要注意的地方arguments。

  当然,JavaScript还可以直接定义对象:
   var obj={};
  定义一个没有属性和方法的对象obj;
   var obj={
      name:"Jerry",           
      "age":23,
      "sayHello":function()
       {
             alert(name+",I love you");
       }

   };
   obj.sayHello();
   alert(obj["name"]);
   这样调用完全可以运行。并且根据这种做法可以当作JavaScript中的Hashtable   
分享到:
评论

相关推荐

    javascript oop模式讲解

    JavaScript OOP(面向对象编程)模式是编程领域中一种重要的设计思想,它允许开发者通过类和对象来组织和管理代码,提高代码的可重用性和可维护性。在这个讲解中,我们将深入探讨JavaScript中的OOP模式,特别是如何...

    javascript oop开发滑动(slide)菜单控件.docx

    ### JavaScript OOP 开发滑动 (Slide) 菜单控件 #### 一、概述 在本篇文章中,我们将探讨如何使用JavaScript面向对象编程(OOP)来开发一个可滑动的菜单控件。该控件能够根据用户的交互(如鼠标悬停)动态展示或隐藏...

    JavaScript OOP

    JavaScript OOP,自己对js的一点学习心得,希望能对大家有所帮助,谢谢大家的积分和支持!

    Javascript(OOP).rar_javascript_javascript O_oop javascript

    JavaScript,作为一种广泛应用于Web开发的动态编程语言,其面向对象编程(Object-Oriented Programming,简称OOP)特性是理解其高级用法的关键。本文档深入探讨了JavaScript中的面向对象特性,包括类、对象、继承、...

    Javascript oop设计模式 面向对象编程简单实例介绍

    JavaScript中的面向对象编程(OOP)是一种强大的编程范式,它允许我们以更接近现实世界的方式来组织代码。在JavaScript中,我们通常通过构造函数、原型和封装等概念来实现OOP。 首先,让我们看下传统的JavaScript...

    javascript-OOP:JavaScript OOP

    JavaScript OOP,即JavaScript面向对象编程,是JavaScript语言中一种重要的编程范式,它使得代码更加结构化、可维护和可重用。在JavaScript中,OOP主要通过类(Class)和对象(Object)来实现,同时利用了封装、继承...

    SoftUni---JavaScriptOOP:为 SoftUni 的 JavaScript OOP 课程提供作业解决方案

    JavaScript面向对象编程(Object-Oriented Programming,简称OOP)是JavaScript编程中极其重要的...在SoftUni---JavaScriptOOP-master这个压缩包中,可能包含了这些知识点的练习和示例代码,供学生实践和巩固所学知识。

    JAVASCRIPT OOP -- 参考资料

    NULL 博文链接:https://orange5458.iteye.com/blog/1387988

    玩转JavaScript OOP – 类的实现详解

    总的来说,JavaScript的OOP主要包括对象的创建、属性和方法的定义、以及继承和多态等概念。通过构造函数和原型对象,我们可以模拟类的结构,实现面向对象的设计模式,有效地组织和复用代码。理解这些概念对于编写...

    JavaScriptOOP:JavaScript 面向对象编程

    JavaScriptOOP,即JavaScript面向对象编程,是JavaScript编程中一种重要的编程范式,它使得代码更加模块化、可维护性和可重用性更强。在JavaScript中,面向对象编程主要依赖于三大特性:封装、继承和多态。接下来,...

    Sample-JavaScript-OOP-Exam-Restaurant-Manager:示例 JavaScript OOP 考试 - 餐厅经理

    在本项目"Sample-JavaScript-OOP-Exam-Restaurant-Manager"中,我们探讨了如何使用面向对象编程(OOP)技术来构建一个餐厅管理系统的JavaScript应用。这个项目主要适用于学习JavaScript OOP概念和实践的学员,通过...

    JavaScriptOOP-Homeworks

    JavaScriptOOP-Homeworks 是一个关于JavaScript面向对象编程(Object-Oriented Programming,简称OOP)的学习资源,可能是某个在线课程或教程的作业集合。这个压缩包可能包含了一系列的练习、项目或代码示例,旨在...

    javascript-oop-presentation:Javascript OOP演示

    JavaScript面向对象编程(OOP)是现代Web开发中不可或缺的一部分,尤其对于构建复杂、可维护的应用程序至关重要。在这个演示中,我们将深入探讨JavaScript中的面向对象编程概念,以便软件工程师能够更好地理解和应用...

    JavaScipt-OOP:JavaScript OOP课程作业

    JavaScript面向对象编程(Object-Oriented Programming,OOP)是JavaScript开发中不可或缺的一部分,它允许开发者组织代码,创建可重用的组件,并实现更复杂的逻辑。在这个“JavaScript OOP课程作业”中,我们将会...

    JavaScript OOP面向对象介绍

    ### JavaScript OOP面向对象介绍 #### 一、面向对象编程(OOP)概念 面向对象编程(Object-Oriented Programming,简称OOP)是一种程序设计思想。它将计算机程序视为一组对象的集合,而每个对象都可以接收其他对象...

    js_oop_info:关于 JavaScript OOP 的信息

    Javascript OOP 基础术语Field::一个不是函数的变量var x = 1; 方法:一个变量就是一个函数var x = function(){}; 成员:方法或字段Class : 一个旨在通过使用new关键字被多个实例重用的函数(还有其他方法可以创建一...

    javascriptoop:oo js的代码段

    以下是关于"javascriptoop:oo js的代码段"中涉及的关键知识点: 1. **类**: 在ES6(ECMAScript 2015)之前,JavaScript并没有内置的类机制,而是通过函数和原型来模拟类的概念。ES6引入了`class`关键字,提供了一...

    javascript的oop

    JavaScript的面向对象编程(OOP)是Web开发中不可或缺的一部分,它允许我们通过类和对象来组织和管理代码,提高代码的复用性和可维护性。这篇博客文章(链接已提供)深入探讨了JavaScript中的OOP概念,我们将在这里...

    JavaScriptOOP

    JavaScriptOOP,即JavaScript面向对象编程,是JavaScript语言中一种重要的编程范式,它使得代码更加模块化、可重用且易于维护。在JavaScript中,面向对象编程主要依赖于对象、类、继承、封装和多态等核心概念。 1. ...

Global site tag (gtag.js) - Google Analytics