1.面向对象:js原型

java有class和instance,js仅仅有构造函数(function Cat(name,age){this.name=name;this.age=age}),为了实现数据共享和抽象出通用的属性,加了一个原型prototype

eg:

function Cat(name,age){

this.name = name;//这里的this相当于java里面的instance

this.age = age;

this.work = function(){

alert("I am working");

}

}

var cat1 = new Cat("cat1",13);

var cat2 = new Cat("cat2",15);

cat1和cat2的都有work属性,可是一样的属性,明显是多余的,造成浪费。能够抽象出原型出来

function Dog(name,age){

this.name = name;

this.age = age;

}

Dog.prototype = {work:function(){alert("I am working!")}}或者

Dog.prototype.work = function(){

alert("I am working");

}

2.封装:

原始模式:var cat = {};cat.name = "cat1";cat.id = "id1";

原始模式改进:var cat = function cat(name,id){return {name:name,id:id}},相当于调用函数

构造函数模式:function(name,id){this.name = name;this.id=id}

js中构造函数在初始化的时候加new和不加new的差别

function Dog(name,age){

this.name = name;

this.age = age;

}

Dog.prototype = {work:function(){alert("I am working!")}}

var dog1 = Dog("dog1",12);//这仅仅是相当于调用普通函数。原型work不会生成,调用work属性会报错

var dog2 = new Dog("dog2",13);//这里是调用构造函数,初始化原型work

var dog3 = new Dog("dog3",14);

dog2.constructor == Dog;   dog3.constructor == Dog

为了解决从原型对象生成实例的问题,Javascript提供了一个构造函数(Constructor)模式。

所谓"构造函数",事实上就是一个普通函数,可是内部使用了this变量。对构造函数使用new运算符,就能生成实例。而且this变量会绑定在实例对象上。

3.继承

(1)对象冒充

function ClassA(sColor) {
this.color = sColor;
this.sayColor = function () {
alert(this.color);
};
} function ClassB(sColor) {
}
function ClassB(sColor) {
this.newMethod = ClassA;
this.newMethod(sColor);
delete this.newMethod;
}

在这段代码中,为 ClassA 赋予了方法 newMethod(请记住。函数名仅仅是指向它的指针)。然后调用该方法。传递给它的是 ClassB 构造函数的參数 sColor。最后一行代码删除了对 ClassA 的引用,这样以后就不能再调用它。

全部新属性和新方法都必须在删除了新方法的代码行后定义。否则。可能会覆盖超类的相关属性和方法:

function ClassB(sColor, sName) {
this.newMethod = ClassA;
this.newMethod(sColor);
delete this.newMethod; this.name = sName;
this.sayName = function () {
alert(this.name);
};
}
var objA = new ClassA("blue");
var objB = new ClassB("red", "John");
objA.sayColor(); //输出 "blue"
objB.sayColor(); //输出 "red"
objB.sayName(); //输出 "John"

js 构造函数(construction)与原型(prototype)的更多相关文章

  1. 类(class)、构造函数(constructor)、原型(prototype)

    类 Class 类的概念应该是面向对象语言的一个特色,但是JavaScript并不像Java,C++等高级语言那样拥有正式的类,而是多数通过构造器以及原型方式来仿造实现.在讨论构造器和原型方法前,我可 ...

  2. 【JS】中的原型prototype到底是个啥

    一.什么是原型 原型prototype是函数的一个属性,这个属性是一个指针,指向一个对象(原型对象),这个原型对象的用途是包含可以由特定类型的所有实例共享的属性和方法. 函数也是一种对象.它也是属性的 ...

  3. JavaScript中的类(class)、构造函数(constructor)、原型(prototype)

    类 Class 类的概念应该是面向对象语言的一个特色,但是JavaScript并不像Java,C++等高级语言那样拥有正式的类,而是多数通过构造器以及原型方式来仿造实现.在讨论构造器和原型方法前,我可 ...

  4. JS构造函数原理与原型

    1.创建对象有以下几种方式: ①.var obj = {}; ②.var obj = new Object(); ③.自定义构造函数,然后使用构造函数创建对象 [构造函数和普通函数的区别:函数名遵循大 ...

  5. 08 (h5*) js第9天--原型、继承

    目录: 1:原型和原型链 2:构造函数的原型可以改变 3:原型的最终指向 4:先修改原型指向,在添加方法. 5:实例对象中的属性和原型属性重合, 6:一个神奇的原型链 7:继承 8:原型链 9:利用c ...

  6. js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法。

    js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } Class ...

  7. js一种继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法。

    js一种继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } ClassA ...

  8. 深入研究js构造函数和原型

    很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...

  9. JS构造函数的用法和JS原型

    $(function(){ var rec = new Rectangle(5, 10); //alert(rec.width + "*" + rec.height + " ...

随机推荐

  1. 洛谷P3857 [TJOI2008]彩灯 [线性基]

    题目传送门 彩灯 题目描述 Peter女朋友的生日快到了,他亲自设计了一组彩灯,想给女朋友一个惊喜.已知一组彩灯是由一排N个独立的灯泡构成的,并且有M个开关控制它们.从数学的角度看,这一排彩灯的任何一 ...

  2. UVA12995 Farey Sequence [欧拉函数,欧拉筛]

    洛谷传送门 Farey Sequence (格式太难调,题面就不放了) 分析: 实际上求分数个数就是个幌子,观察可以得到,所求的就是$\sum^n_{i=2}\phi (i)$,所以直接欧拉筛+前缀和 ...

  3. 借助jxl将Excel中的数据注入到Bean中

    前言 使用了Hibernate的项目中需要导入多张表的数据,但是我又不想写多次取出Excle数据放到Bean里的代码,于是写了个ExcleUtils来帮助我做这件事. 基本思路 技术上,首先肯定是要借 ...

  4. JSP中常用JSTL用法

    使用标签时,需要在jsp文件头加入以下代码: <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/cor ...

  5. BZOJ1038 瞭望塔

    学习了半平交面. 我这里写的是训练指南中的双端队列,每次判断是否删去更优然后更新. 看hzwer中有一处不太明白就是为何要将两段加入队列 后来对拍出错才知道是因为精度,当两线重合时他们叉积返回值是一个 ...

  6. [BZOJ4651][NOI2016]网格(Tarjan)

    下面直接给出结论,相关证明见官方题解. 1.若跳蚤数不超过1或仅有两只跳蚤且相邻,则答案为-1. 2.若跳蚤形成的连通块个数大于1,则答案为0. 3.若跳蚤之间建图存在割点,则答案为1. 4.否则为2 ...

  7. (VIJOS) VOJ 1067 Warcraft III 守望者的烦恼 矩阵快速幂

    https://vijos.org/p/1067   就..挺普通的一道题..自己学一下怎么推式子就可以...细节不多但是我还是日常爆细节..比如说循环写成从负数开始...   只求ac不求美观的丑陋 ...

  8. PHP+MySQL中字符集问题分析

    Character set顾名思义,就是字符.以及字符对应的编码的集合.例如简体中文字符集gb2312就包括简体中文中的所有规定汉字,以及每个汉字对应的代码. Collation,是指比较字符的规则的 ...

  9. Java获取Access数据库连接单例简单实例

    Java在连接Access数据库时比较方便,不用导入第三方的jar包,jdk中内置的odbc可以完成Access数据库的访问,需要注意的是,我们首先要配置Access数据库的数据源,还要区分x86和x ...

  10. Unity Pivot/Center与Local/Global总结

    Untiy左上角有两个按钮  Pivot/Center 和 Local/Global  它们叫做 变换Gizmo工具 Pivot/Center:现实游戏对象的轴心参考点.Center为以所有选中物体所 ...