`
yahaitt
  • 浏览: 759930 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

js面向对象

阅读更多
记录自浪曦风中叶老师的JavaScript课堂

1、js区别于java的特性还有:实例化类对象时,如果不传递参数,则可以省略括号,如:
  var object = new Object;
  var string = new String;
  var date = new Date;

  当然也可以写成带括号的,如:
  var object = new Object();
 
  建议带括号,以符合java模式

  以上Object、String、Date等都是内置类,即本地类

2、数组的两种呈现方式:数组类Array及[]
  var array = new Array();//array为数组类实例对象,也就是数组
  array.push(1);
  array.push(2);
  array.push(3);

  alert(array.length);//结果:3 数组类Array有length属性

  var array = [];
  array.push(1);
  array.push(2);
  array.push(3);

  var array = [1,2,3];

  以上3种情况结果都一样,第3种用的最常见

3、早绑定和晚绑定:js都是晚绑定,java都是早绑定

4、js中类的定义方式:
  A、工厂方式定义类
  第一种方式:
  function createObject(username,password){
    var object = new Object();
    object.username = username;
    object.password = password;
    //多个对象就会有多个匿名对象(也就是匿名方法)产生
    object.get = function(){
      //此时,this指向的是当前对象,即object
      alert("username: " + this.username + "\npassword:" + this.password);
    };
    return object;
  }
  var o1 = createObject("zhangsan","123456");
  o1.get();

  第二种方式:
  function get(){
    //此时,this指向的是调用get方法的对象
    alert("username: " + this.username + "\npassword:" + this.password);
  }

  function createObject(username,password){
    var object = new Object();
    object.username = username;
    object.password = password;
    //不管有几个对象产生,get方法(对象)只产生一个
    object.get = get;
    return object;
  }
  var o1 = createObject("zhangsan","123456");
  o1.get();

  B、构造函数方式定义类
  第一种方式:
  function Person(username,password){
    //new Person时会产生一个对象,this就会指向这个对象,并且会将这个对象返回,因此当new Person时能得到对象
    this.name = username;
    this.password = password;
    this.get = function(){
      //多个Person对象就会有多个匿名对象(也就是匿名方法)产生
      alert("username: " + this.username + "\npassword:" + this.password);
    };
  }
  var o1 = new Person("zhangsan","123456");
  o1.get();

  第二种方式:
  function get(){
    //此时,this指向调用get方法的对象
    alert("username: " + this.username + "\npassword:" + this.password);
  }

  function Person(username,password){
    //new Person时会产生一个对象,this就会指向这个对象,并且会将这个对象返回,因此当new Person时能得到对象
    this.name = username;
    this.password = password;
    //不管有几个对象产生,get方法(对象)只产生一个
    this.get = get;
  }
  var o1 = new Person("zhangsan","123456");
  o1.get();

  C、原型方式创建类:prototype,prototype是每个类或每个对象都具有的属性,可以通过对prototype来实现对类或对象的属性或方法的追加
  特点:不管产生多少个实例对象,其追加的方法只产生一次
  function Person(){
  }
  Person.prototype.username = "zhangsan";//Person.prototype.username = new Array();
  Person.prototype.password = "123";
  Person.prototype.get = function(){
    alert("username: " + this.username + "\npassword: " + this.password);
  }
  var person = new Person();
  var person2 = new Person();
  //person.username.push("zhangsan");
  person.get();
  person2.get();

  弊端1:不能通过在new的时候给予不同的初始化值
  弊端2:如果prototype中的一个属性的值是一个对象,而不是一个字符串,比如数组,那么当一个实例对象对这个数组进行了操作后,其他的实例对象也会受到影响,因为他们的同一个属性值都是指向了同一个数组对象。

  D、混合的构造函数与原型方式:属性采用构造函数方式定义,方法采用原型方式定义
  特点1:每个实例对象的属性值互不影响,即同名的属性其值都是指向了不同的数据或对象。
  特点2:能够实现每个实例对象在构造时就能传递初始化信息
  特点3:每个实例对象共享方法,即每个实例对象的同名方法都是指向同一个匿名方法,即这个匿名方法不会因对象的创建而产生多个,它就只有一个
  弊端:类定义中属性和方法定义分开,整体性欠缺

  第一个示例:
  function(){
    this.username = new Array();
    this.password = "123";
  }
  Person.prototype.get = function(){
    alert("username: " + this.username + "\npassword: " + this.password);
  }
  var p = new Person();
  p.username.push("zhangsan");
  var p2 = new Person();
  p.get();
  p2.get();

  第二个示例:
  function Person(username,password){
    this.username = username;
    this.password = password;
  }
  Person.prototype.get = function(){
    alert("username: " + this.username + "\npassword: " + this.password);
  }
  var p = new Person("zhangsan","123");
  var p2 = new Person("lisi","123456");
  p.get();
  p2.get();

  E、动态的原型方式
  function Person(){
    this.username = "zhangsan";
    this.password = "123";
    if(typeof Person.flag == "undefined"){
      //使得在创建多个对象时,匿名方法只产生一次
      Person.prototype.get = function(){
        alert("username: " + this.username + "\npassword: " + this.password);
      }
      Person.flag = true;
    }
  }
  var person = new Person();
  person.get();
分享到:
评论

相关推荐

    js 面向对象实例

    在JavaScript面向对象的上下文中,我们可以创建专门处理Canvas绘图的类,封装复杂的绘图逻辑: ```javascript class Circle { constructor(x, y, radius) { this.x = x; this.y = y; this.radius = radius; } ...

    Javascript面向对象编程.

    在提供的资源中,《代码之美》PDF文件可能包含了关于编程实践和代码风格的指导,而《Javascript面向对象编程》PPT可能更具体地阐述了JavaScript OOP的细节和示例。学习这些材料将有助于深入理解JavaScript的面向对象...

    JS面向对象经典案例

    在本文中,我们将介绍JavaScript面向对象编程中的经典案例,包括对象、类、继承、原型链和闭包等概念。 一、对象和类 在JavaScript中,对象是指一个实体,可以拥有自己的属性和方法。对象可以使用工厂函数或构造...

    JavaScript面向对象编程指南.pdf

    JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在... 《JavaScript面向对象编程指南》着重介绍JavaScript在面向对象方面的特性,展示如何构建强健的、可维护的、功能强大的应用程序及程序库

    JavaScript面向对象编程指南

    《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...

    JS面向对象的基础大家去看JS面向对象的基础

    JS面向对象的基础 写的很好的,大家去看JS面向对象的基础 JS面向对象的基础 写的很好的,大家去看JS面向对象的基础

    JavaScript面向对象编程指南(第2版).rar

    JavaScript是一种广泛...通过深入学习这本《JavaScript面向对象编程指南(第2版)》,开发者不仅能掌握JavaScript的面向对象编程基础,还能了解到实际项目中如何有效地运用这些知识,提升编程技巧和解决问题的能力。

    JAVASCRIPT 面向对象编程精要

    ### JavaScript面向对象编程精要 #### 一、引言 JavaScript是一种灵活且强大的脚本语言,它虽然起源于一种简单的浏览器脚本语言,但随着时间的发展,JavaScript已经成为了一种功能全面的编程语言,尤其是在Web开发...

    javascript面向对象编程.pdf

    总而言之,学习现代JavaScript面向对象编程,有助于开发者在认识这门语言演化的基础上,运用面向对象的设计和编程模式来构建更加健壮和可维护的JavaScript应用程序。同时,测试和调试是保证代码质量不可或缺的环节,...

    javascript面向对象

    ### JavaScript面向对象编程详解 #### 引言 在软件工程领域,面向对象编程(OOP)是一种编程范式,它使用“对象”来设计软件。每个对象都可以包含数据(属性)和方法(行为)。JavaScript虽然起初并非为面向对象...

    JavaScript面向对象精要(英文版)

    ### JavaScript面向对象精要 #### 一、概述 《JavaScript面向对象精要》是一本深入讲解JavaScript面向对象编程原理的专业书籍。本书由知名的前端开发者Nicholas C. Zakas撰写,全面介绍了JavaScript作为一种动态...

    JavaScript面向对象编程指南 pdf

    下面将详细探讨JavaScript面向对象编程的基本原理、特性以及实际应用。 1. **类与对象** - 在JavaScript中,对象是键值对的集合,可以通过字面量语法或构造函数创建。例如: ```javascript const person = { ...

    js面向对象简单理解

    JavaScript是一种广泛应用于Web开发的动态编程语言,尤其以其强大的面向对象特性而闻名。面向对象编程(Object-Oriented ...通过阅读`prototype.js`这样的示例代码,可以帮助加深对JavaScript面向对象编程的理解。

Global site tag (gtag.js) - Google Analytics