JavaScript 定义 类

一 构建类的原则

构造函数 等于 原型的constructor

    //构造函数
    function Hero(name,skill){
        this.name = name;
        this.skill = skill;
    }
    //原型
    Hero.prototype;

    //构造函数 === 原型的constructor
    Hero === Hero.prototype.constructor;    //=>true

    //实例均继承原型

二构建类的方法:

1.直接使用构造方法

该方法创建实例会将内容给每个类都创建一份

//实例属性方法都声明在构造器里
function Hero(name,skill){
    this.name = name;
    this.skill = skill;
    this.sayHello = function(){
        console.log(this.name + ";" + this.skill);
    }
}
//类静态常量
Hero.common = '都有特别的事迹';
//类静态方法
Hero.doSomething = function(){
    console.log('doSomething');
}
var saber = new Hero ('Saber','Excalibur');
saber.sayHello();

var archer = new Hero('Archer','Unlimit Blade Work');
archer.sayHello();

//此处为每个对象都拷贝了一份sayHello 方法 会浪费内存空间
saber.sayHello == archer.sayHello;//=>false

2.优化构造器方法--将方法函数移到构造器的prototype

  • 每个实例都会有一个__proto__属性指向构造函数的prototype
  • 这样每个实例在当前找不到方法后会到prototype寻找该方法
  • 能避免之前出现的拷贝多个方法的情况

2.1扩展prototype

//实例属性方法都声明在构造器里
function Hero(name,skill){
    this.name = name;
    this.skill = skill;
}
Hero.prototype.sayHello = function(){
    console.log(this.name + ";" + this.skill);
}

//类静态常量
Hero.common = '都有特别的事迹';
//类静态方法
Hero.doSomething = function(){
    console.log('doSomething');
}
var saber = new Hero ('Saber','Excalibur');
saber.sayHello();

var archer = new Hero('Archer','Unlimit Blade Work');
archer.sayHello();

saber.sayHello == archer.sayHello;//=>true
    

2.2重写prototype

//实例属性方法都声明在构造器里
function Hero(name,skill){
    this.name = name;
    this.skill = skill;
}

Hero.prototype = {
    //保持 构造函数 等于 原型的constructor
    constructor:Hero,
    sayHello:function(){
        console.log(this.name + ";" + this.skill);
    }
}

//类静态常量
Hero.common = '都有特别的事迹';
//类静态方法
Hero.doSomething = function(){
    console.log('doSomething');
}

JavaScript 定义 类的更多相关文章

  1. Javascript定义类(class)的三种方法

    将近20年前,Javascript诞生的时候,只是一种简单的网页脚本语言.如果你忘了填写用户名,它就跳出一个警告. 如今,它变得几乎无所不能,从前端到后端,有着各种匪夷所思的用途.程序员用它完成越来越 ...

  2. [转]Javascript定义类的三种方法

    作者: 阮一峰 原文地址:http://www.ruanyifeng.com/blog/2012/07/three_ways_to_define_a_javascript_class.html 将近2 ...

  3. javascript 定义类(转载)

    Javascript本身并不支持面向对象,它没有访问控制符,它没有定义类的关键字class,它没有支持继承的extend或冒号,它也没有用来支持虚函数的virtual,不过,Javascript是一门 ...

  4. javascript定义类和类的实现

    首先说说类,在一个类里我们会有以下的几个特征: 1. 公有方法 2. 私有方法 3. 属性 4. 私有变量 5. 析构函数 我们直接看一个例子: /***定义类***/ var Class = fun ...

  5. JavaScript 定义类的最佳写法——完整支持面向对象(封装、继承、多态),兼容所有浏览器,支持用JSDuck生成文档

    作者: zyl910 [TOC] 一.缘由 由于在ES6之前,JavaScript中没有定义类(class)语法.导致大家用各种五花八门的办法来定义类,代码风格不统一.而且对于模拟面向对象的三大支柱& ...

  6. javascript定义类的方法总结

    1.构造函数法 类是对象的模板,定义了对象共有的方法属性数据 等,在javascript中一个函数就是一个对象,也可以看做一个类的构造方法. 所以我们可以像以下方式定义类: //1.经典的构造方法 Q ...

  7. 我所了解的关于JavaScript定义类和对象的几种方式

    原文:http://www.cnblogs.com/hongru/archive/2010/11/08/1871359.html 在说这个话题之前,我想先说几句题外话:最近偶然碰到有朋友问我“hois ...

  8. JavaScript定义类的几种方式

    提起面向对象我们就能想到类,对象,封装,继承,多态.在<javaScript高级程序设计>(人民邮电出版社,曹力.张欣译.英文名字是:Professional JavaScript for ...

  9. JavaScript定义类与对象的一些方法

    最近偶然碰到有朋友问我"hoisting"的问题.即在js里所有变量的声明都是置顶的,而赋值则是在之后发生的.可以看看这个例子: 1 var a = 'global'; 2 (fu ...

随机推荐

  1. HTTP 和 HTTPS

    一.HTTP协议 最近看了一些网络通信方面的书籍,研究了一下 HTTP 和 TCP/IP,有了一些新的收获和理解,在这里做个归纳和总结. (1)什么是HTTP协议 HTTP (HyperText Tr ...

  2. 浅谈MVC异常处理

    在日常开发中,我们会去捕捉很多的异常,来进行处理,通常我们的方法就是,在需要进行异常处理的地方加上 try catch 块,但是,如果需要异常处理的地方很多,那么,就会频繁的去写try catch 块 ...

  3. C#基础篇--面向对象(类与对象)

    1.类是什么?  类就相当于模板,就是把同一类的事物的共同特征进行的抽象. 类的创建和说明: 类是先根据一些具体的对象(实体的东西)来抽象出来的共同的特性,然后用代码来表示. 在类中,用数据表示事物的 ...

  4. .net开源权限管理系统

    有业务请加QQ 245747009 源码地址:http://git.oschina.net/sunzewei/EIP 一.更新记录1.更新日期:2017-02-24 00:00:002.更新内容: 版 ...

  5. 简化布隆过滤器——BitMap

    简化布隆过滤器--BitMap 前言 前段开发项目试就发现,一部分的代码实现存在着一些性能上的隐患.但当时忙于赶进度和由于卡发中的不稳定因素,想了许多解决方案也没有机会实施.最近,正好趁个机会进行一系 ...

  6. 高性能迷你React框架anu在低版本IE的实践

    理想是丰满的,现实是骨感的,react早期的版本虽然号称支持IE8,但是页面总会不自觉切换到奇异模式下,导致报错.因此必须让react连IE6,7都支持,这才是最安全.但React本身并不支持IE6, ...

  7. datatables 学习笔记1 基础篇

    本文共3部分:基本使用|遇到的问题|属性表 1.DataTables的默认配置 $(document).ready(function() { $('#example').dataTable(); } ...

  8. socket套接字编程

    一.概述 1.socket是一种进程间通信方式,既可以用于一台机器,也可以用于网络.常用语C/S模型. 2.可以跨越Windows和Linux操作系统,可以跨越不同语言. 3.注意网络字节序和主机字节 ...

  9. 执行ANT JAVA三种方式

    1. 命令行 <target name="reporttoexcel" depends="report"> <exec executable= ...

  10. javascript中event.clientX和event.clientY用法的注意事项

    今天做项目用到了event.clientX和event.clientY,给元素定位,用定位的时候,让top和left等于事件元素的的坐标 <!DOCTYPE html> <html& ...