基于JavaScript 类的使用详解

以下为构造函数方法创建类:


代码如下:

function className (prop_1, prop_2, prop_3) { 
this.prop1 = prop_1; 
this.prop2 = prop_2; 
this.prop3 = prop_3;}

有了上面的类,我们就可以为类创建实例:


代码如下:

var obj_1 = new className(v1, v2, v3)
var obj_2 = new className(v1, v2, v3)

我们也可以给类添加方法(method),其实就是Function里的Function。


代码如下:

function className (prop_1, prop_2, prop_3) {
  this.prop1 = prop_1;
  this.prop2 = prop_2;
  this.prop3 = prop_3;
  this.func = function new_meth (property) {
        //coding here
  }
}

属性访问域:

在JavaScript里,对象的属性默认都是全局的,也就是说,对象内外都可以直接访问该属性。上面例子里this.prop1, this.prop2, this.prop3都是全局属性。

如何定义私有属性呢?使用var,下面的例子里,price就变成了私有属性!


代码如下:

function Car( listedPrice, color ) {
    var price = listedPrice;
    this.color = color;
    this.honk = function() {
        console.log("BEEP BEEP!!");
    };
}

如果你想访问私有属性,那么你可以在对象内添加一个方法去返回这个私有属性,因为方法在对象内,所以可以访问对象的私有属性。在外部调用该方法,就可以访问到这个私有属性了。但是在方法里,就不能再用this.了,像上面的例子,要访问price,就可以在对象里添加方法:


代码如下:

this.getPrice = function() {
//return price here!       
return price;
--------------------------------------------------------------------------------

继承:

使用以下语法继承:


代码如下:

ElectricCar.prototype = new Car();

使用instanceOf检查对象是否某对象的继承,返回true或false。


代码如下:

myElectricCar instanceof Car

给继承后的对象添加方法:


代码如下:

// 使用构造函数定义一个新的对象
function ElectricCar( listedPrice ) {
    this.electricity=100;
    var price = listedPrice;
}

// 使新对象继承Car
ElectricCar.prototype = new Car();

// 为新对象添加方法
ElectricCar.prototype.refuel = function(numHours) {
    this.electricity =+ 5*numHours;
};

重写原型对象的值或方法:
当我们继承原型对象后,我们会继承原型的值和方法。但有的时候,我们的对象值或方法可能会不同,这时候,我们可以通过重写原型对象的值和方法来改变新对象的内容


代码如下:

function Car( listedPrice ) {
   var price = listedPrice;
   this.speed = 0;
   this.numWheels = 4;

this.getPrice = function() {
       return price;
   };
}

Car.prototype.accelerate = function() {
   this.speed += 10;
};

function ElectricCar( listedPrice ) {
   var price = listedPrice;
   this.electricity = 100;
}
ElectricCar.prototype = new Car();

// 重写accelerate方法
ElectricCar.prototype.accelerate = function() {
  this.speed += 20; 
};
// 添加新方法decelerateElectricCar.prototype.decelerate = function(secondsStepped) {
    this.speed -= 5*secondsStepped;
};

myElectricCar = new ElectricCar(500);

myElectricCar.accelerate();
console.log("myElectricCar has speed " + myElectricCar.speed);
myElectricCar.decelerate(3);
console.log("myElectricCar has speed " + myElectricCar.speed);

(0)

相关推荐

  • 基于JavaScript 类的使用详解

    以下为构造函数方法创建类: 复制代码 代码如下: function className (prop_1, prop_2, prop_3) {  this.prop1 = prop_1;  this.prop2 = prop_2;  this.prop3 = prop_3;} 有了上面的类,我们就可以为类创建实例: 复制代码 代码如下: var obj_1 = new className(v1, v2, v3)var obj_2 = new className(v1, v2, v3) 我们也可以给

  • 基于JavaScript表单脚本(详解)

    什么是表单? 一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域:包含了文本框.密码框.隐藏域.多行文本框.复选框.单选框.下拉选择框和文件上传框等. 表单按钮:包括提交按钮.复位按钮和一般按钮:用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作. JavaScript与表单间的关系:JS最初的应用就是用于分担服务器处理表单的责任,打破依赖服务器的局面,尽管目前web和jav

  • 基于JavaScript自定义构造函数的详解说明

    Javascript并不像Java.C#等语言那样支持真正的类.但是在js中可以定义伪类.做到这一点的工具就是构造函数和原型对象.首先介绍js中的构造函数. Javascript中创建对象的语法是在new运算符的后面跟着一个函数的调用.如 复制代码 代码如下: var obj = new Object(); var date = new Date(); 运算符new首先创建一个新的没有任何属性的对象,然后调用该函数,把新的对象作为this关键字的值传递.var date = new Date()

  • 玩转JavaScript OOP - 类的实现详解

    概述 当我们在谈论面向对象编程时,我们在谈论什么? 我们首先谈论的是一些概念:对象.类.封装.继承.多态. 对象和类是面向对象的基础,封装.继承和多态是面向对象编程的三大特性. JavaScript提供了对象却缺乏类,它不能像C#一样能显式地定义一个类. 但是JavaScript的函数功能非常灵活,其中之一就是构造函数,结合构造函数和原型对象可以实现"类". 对象和类的概念 对象 "对象"是面向对象编程中非常重要的一个概念,一个对象是一个"东西"

  • 基于java涉及父子类的异常详解

    java中的异常涉及到父子类的问题,可以归纳为一句话:子类的构造函数抛出的异常必须包含父类的异常,子类的方法可以选择抛出"范围小于等于"父类的异常或不抛出异常. 1. 为什么构造函数必须抛出包含父类的异常? 在<thingking in java>中有这么一段话: 异常限制:当覆盖方法时,只能抛出在基类方法的异常说明中列出的那些异常 异常限制对构造器不起作用,你会发现StormyInning的构造器可以抛出任何异常,而不必理会基类构造函数所抛出的异常.然而因为必须构造函数必

  • 基于java Files类和Paths类的用法(详解)

    Java7中文件IO发生了很大的变化,专门引入了很多新的类: import java.nio.file.DirectoryStream; import java.nio.file.FileSystem; import java.nio.file.FileSystems; import java.nio.file.Files; import java.nio.file.Path; import java.nio.file.Paths; import java.nio.file.attribute.

  • 基于MFC实现类的序列化详解

    序列化是将程序中的对象以一种二进制格式存储到存储设备中(例如文本/数据库等),以实现“永生”或随意“流动” 首先定义一个要序列化的类people,其属性有age.weight.height. #pragma once class people { public: int age; int weight; int height; }; 定义好后将该类添加到  项目名view.h  的类中,作为其属性,并且是指针类型 将需要存取的类实现序列化 1.序列化的类必须从CObject派生,或是从CObje

  • 基于SpringMVC接受JSON参数详解及常见错误总结

    最近一段时间不想使用Session了,想感受一下Token这样比较安全,稳健的方式,顺便写一个统一的接口给浏览器还有APP.所以把一个练手项目的前台全部改成Ajax了,跳转再使用SpringMVC控制转发.对于传输JSON数据这边有了更深的一些理解,分享出来,请大家指正. 在SpringMVC中我们可以选择数种接受JSON的方式,在说SpringMVC如何接受JSON之前,我们先聊聊什么是JSON.具体的定义我也不赘述了,在JavaScript中我们经常这样定义JSON 对象 var jsonO

  • 基于tomcat配置文件server.xml详解

    1. 入门示例:虚拟主机提供web服务 该示例通过设置虚拟主机来提供web服务,因为是入门示例,所以设置极其简单,只需修改$CATALINA_HOME/conf/server.xml文件为如下内容即可.其中大部分都采用了默认设置,只是在engine容器中添加了两个Host容器. <?xml version="1.0" encoding="UTF-8"?> <Server port="8005" shutdown="SH

  • 基于Vue单文件组件详解

    本文将详细介绍Vue单文件组件 概述 在很多 Vue 项目中,使用 Vue.component 来定义全局组件,紧接着用 new Vue({ el: '#container '}) 在每个页面内指定一个容器元素. 这种方式在很多中小规模的项目中运作的很好,在这些项目里 JavaScript 只被用来加强特定的视图.但当在更复杂的项目中,或者前端完全由 JavaScript 驱动的时候,下面这些缺点将变得非常明显: 1.全局定义 (Global definitions) 强制要求每个 compon

随机推荐