JavaScript的写类方式(6)

时间到了2015年6月18日,ES6正式发布了,到了ES6,前面的各种模拟类写法都可以丢掉了,它带来了关键字 class,extends,super。

ES6的写类方式

// 定义类 Person
class Person {

  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  setName(name) {
    this.name = name;
  }

  getName() {
    return this.name;
  }

  toString() {
    return ‘name: ‘ + this.name + ‘, age: ‘ + this.age;
  }

}

// 创建实例对象
var p = new Person(‘Backus‘, 35);
p instanceof Person; // true

和 Java 多象啊,再看看继承

class Man extends Person {
  constructor(name, age, school) {
    super(name, age); // 调用父类构造器
    this.school = school;
  }

  setSchool(school) {
    this.school = school;
  }

  getSchool() {
    return this.school;
  }

  toString() {
    return super.toString() + ‘, school:‘ + this.school; // 调用父类的toString()
  }
}

var man = new Man(‘张三‘, ‘30‘, ‘光明中学‘);
man instanceof Man; // true
man instanceof Person; // true
console.log(man);

以上代码中,constructor 和 toString 方法中,都出现了 super 关键字,它指代父类的实例(即父类的 this 对象)。 之前 ES5 有个 Object.getPrototypeOf 来获取父类的原型对象

可以继续阅读:

JavaScript继承方式(1)

时间: 2024-08-24 03:09:15

JavaScript的写类方式(6)的相关文章

JavaScript中创建类

缘由:因为要给根据是否选中checkbox来动态增加ajax中data的属性(ajax的data属性格式的几种方法,参考http://www.jb51.net/article/46676.htm) data: "name=John&location=Boston", //第一种方式传参    data: {name:"John",location:"Boston"}  //第二种方式传参  (PS,个人感觉这里应该是写错了,应该是{“na

玩转JavaScript OOP[2]——类的实现

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

javascript继承的实现方式介绍

javascript继承的实现方式介绍:作为面向对象的一门语言,继承自然是javascript所比不可少的特性,下面就简单介绍一下javascript实现继承的几种方式,希望能够对需要的朋友带来一定的帮助,下面进入正题.一.对象冒充: function A() { this.name="蚂蚁部落"; this.address="青岛市南区"; } function B() { this.target="提供免费的教程"; this.newA=A;

javascript动手写日历组件(1)——构建日历逻辑 (by vczero)

一.分析日历的组成部分和交互要素 (1)组成部分:选择年月部分.星期显示.包含本月(或者有前月和下一个月部分日子) (2)根据选择的年和月份,动态绘制日历面板. (3)一个日历 7(天) * 5(周) = 35格表格. (4)一个月份是统一的一个面板:一个月的头一天一定在日历面板的第一行,根据该天的“星期几”确定位置. (5)第一格子是星期一,最后一个格子是星期日,为5周的日历面板. 二.确定逻辑设计 日历上面的日历,8月1号建军节为什么会出现在这一格?因为一个月的天数是小于5周(35天)的,因

javascript基础知识-类和模块

在JavaScript中可以定义对象的类,让每个对象都共享这些属性. 在JavaScript中,类的实现是基于其原型继承机制的.如果两个实例都从同一个原型对象上继承了属性,我们就说它们是同一个类的实例. JavaScript中有一个重要特性是"动态可继承"(dynamically extendable),笔记之后再做. 为什么要定义类:定义类是模块开发和重用代码的有效方式之一. 1)类和原型 在JavaScript中,类的所有实例对象都从一个原型对象上继承属性.因此,源性对象是类的核心

javascript动手写日历组件(3)——内存和性能优化(by vczero)

一.列表 javascript动手写日历组件的文章列表,主要是通过原生的JavaScript写的一个简约的日历组件: (1)javascript动手写日历组件(1)——构建日历逻辑:http://www.cnblogs.com/vczero/p/js_ui_1.html (2)javascript动手写日历组件(2)——优化UI和添加交互:http://www.cnblogs.com/vczero/p/js_ui_2.html (3)javascript动手写日历组件(2)——内存和性能优化:h

Javascript中定义类

Javascript 本身并不支持面向对象,它没有访问控制符,它没有定义类的关键字class,它没有支持继承的extend或冒号,它也没有用来支持虚函数的 virtual,不过,Javascript是一门灵活的语言,下面我们就看看没有关键字class的Javascript如何实现类定义,并创建对象. 一:定义类并创建类的实例对象在Javascript中,我们用function来定义类,如下: function Shape(){var x = 1 ;var y = 2 ;} 你 或许会说,疑?这个

javascript 的加载方式

本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy execution),async 属性, defer 属性 一.同步加载与异步加载的形式 1. 同步加载 我们平时最常使用的就是这种同步加载形式: <script src="http://yourdomain.com/script.js"></script> 同步模式,又称阻塞模式,会阻止浏览器的后续

javascript实现继承的方式

this this表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window: 如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用. 我们还可以使用apply和call两个全局方法来改变函数中this的具体指向. 先看一个在全局作用范围内使用this的例子: <script type="text/javascript"> console.log(this === window);  // true console.log(w