类、构造函数、原型  :本质均为函数
利用的原理是:词法作用域,调用对象及作用域链  闭包  属性查找方式 
 
设计和new运算符一起使用的函数叫做构造函数。
构造函数的工作:初始化一个新创建的对象,设置在使用对象前需要设置的所有属性。
 
注:new创建一个新的没有任何属性的对象,然后调用该函数(调用对象),把此对象作为this关键字的值
传递给构造函数。
构造函数通常是没有返回值,只是为这个this设置属性,但一个构造函数是允许返回一个对象值的,
且如果这么做,返回的对象成为new表达式的值,作为this的值的对象会被抛弃。否则返回this这个对象。
 
原型和继承
一个对象的原型就是它的构造函数的prototype的值,所有的函数都有一个prototype属性,当其被定义时,prototype会自动创建
并初始化,prototype属性的初始化值是一个对象,这个对象只带有一个属性:constructor,它指回到和原型相关的那个构造函数(
这就是每个对象都有一个constructor属性的原因),
为prototype对象添加的任何属性,都会成为构造函数所初始化的对象的属性。
 
常规属性:在构造函数当中,使用this.属性  为其设置属性。方法也如此
继承属性:通过为构造函数的prototype添加属性。方法也如此
 
注:原型对象和构造 函数相关,并且,构造函数初始化的每个对象都确实从原型那里继承了完全相同的属性。
这意味着,原型对象是设置方法和其它不变属性的理想地方。
 
继承作为查找一个属性值的过程的一部分自动发生。
 
首先,使用原型对象可以显著地减少每个对象所需的内存。(因为常规属性存于每个实例当中,都有一份拷贝,但继承属性只有在原型对象当中保存了一部分,并且其它实例共享这份内存)
其次,即使在对象创建以后才添加到原型的属性,对象也可以继承它(得在查找该属性之前就已经添加,事实因为是词法作用域,所以只要定义了就能找到)
 
 
读取和写入继承的属性(通过实例对象)
 
由于一个原型对象可以被很多对象继承,JavaScript必须在读取和写入属性值 的时候,执行一种基本的不对称。
 
1、当读取实例 对象的属性的时候,JavaScript首先检查o是否有此属性,如果没有,它接下来检查此实例对象的原型对象是否有此属性。这使得基于原型的继承能够奏效。
 
2、当写入一个属性的值的时候,Javascript不会使用原型对象,只会为实例定义一个常规属性。
(因为如果使用原型对象添加这个属性,会让其他所有实例都有这个属性)
 
因此,属性继承只在读取属性值的时候发生,而当写入属性的时候不会发生。
 
由于 原型属性是由一个类的所有对象共享的属性,通常只用它们来定义对于类中的所有对象来说都相同的属性,才显得有意义。
这使得原型成为定义方法的理想工具。且如果改变这它,会影响到其它实例对象。
 
扩展内建类型
像String和Date  Function这样的内建的类,也是原型对象可对其扩展,
注:只能对核心的JavaScript的本地对象起作用,当JavaScript嵌入到其它环境中,如一个web浏览器,它就访问另外的
‘宿主对象’ ,如:Document,这些宿主对象一般没有构造函数和原型对象,所以无法扩展。
一般只有在实现缺少某个标准的方法时,才会扩展内建类型。用来实现兼容老版本等。
 
 
在JavaScript中模拟类
实例属性,实例方法
类属性,类方法
 
1、实例属性 实例方法
是那些由构造函数创建和初始化的属性和方法
 
放在构造函数中this创建的,以及放在prototype上定义的属性
 
2、类属性 类方法
类的每个属性 每个方法 都只有一份拷贝,(类本质也是一个对象(构造函数名))
类名.属性名=值;
 
3、私有属性(使用闭包来实现)
 
 
超类和子类   可多级继承
 
Object是所有内建为的超类。所有类都继承了Object的一些基本方法,
这意味着原型对象继承了Object.prototype属性,基于原型的继承并不限于一个单个的原型对象,相反它包含了
一个原型对象的链。
 
因此查找属性时路径:对象本身,超类.prototype对象,Object.prototype对象
 
 //类 构造函数  原型对象  this代表调用对象
function R(w, h) {
var date = new Date();
this.width = w;
this.height = h;
this.createtime = date.getFullYear() + "-" + date.getMonth() + "-" + date.getDay() + " " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds(); }
R.prototype.area = function () {
return this.width * this.height;
}
var o = new R(10, 20);
console.log(o.createtime + ":" + o.area());

输出:"2015-2-2 0:8:11:200"

 //类 构造函数  原型对象  this代表调用对象
function R(w, h) {
var date = new Date();
this.width = w;
this.height = h;
this.createtime = date.getFullYear() + "-" + date.getMonth() + "-" + date.getDay() + " " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
R.count++;
}
R.prototype.area = function () {
return this.width * this.height;
}
//以上创建的都是实例属性和实例方法,以下为类属性和类方法
R.count = 0;
R.getCount = function () {
return R.count;
} var o = new R(10, 20);
console.log("createtime:" + o.createtime + "\narea:" + o.area() + "\nR.count=" + R.getCount());
var o2 = new R(20, 30);
console.log("createtime:" + o2.createtime + "\narea:" + o2.area() + "\nR.count=" + R.getCount());

输出:
createtime:2015-2-2 0:9:14
area:200
R.count=1
createtime:2015-2-2 0:9:14
area:600
R.count=2

 //私有属性(只能通过专门的方法才能读取和写入),使用了闭包原理,因为里面定义的函数被外部的全局对象引用了,
//外部函数的调用对象不会被释放,w 和 h值一直维持最近一次的值,并且直到外部的引用消失,才会被释放内存
function R(w, h) {
this.getWidth = function () {
return w;
}
this.getHeight = function () {
return h;
}
this.setWidth = function (width) {
w = width;
}
this.setHeight = function (height) {
h = height;
}
}
var o = new R(10, 20);
alert(o.getWidth() * o.getHeight());
o.setWidth(100);
o.setHeight(200);
alert(o.getWidth() * o.getHeight());

输出:
200
20000

 

JavaScript 类、构造函数、原型的更多相关文章

  1. 对Javascript 类、原型链、继承的理解

    一.序言   和其他面向对象的语言(如Java)不同,Javascript语言对类的实现和继承的实现没有标准的定义,而是将这些交给了程序员,让程序员更加灵活地(当然刚开始也更加头疼)去定义类,实现继承 ...

  2. javascript类和原型学习笔记

    js中类的所有实例对象都从同一个原型对象上继承属性.我们可以自己写一个对象创建的工厂方法来来"模拟"这种继承行为: //inherit()返回一个继承自原型对象p的属性的性对象 / ...

  3. javascript 构造函数类和原型 prototyp e定义的属性和方法的区别

    1.把方法写在原型中比写在构造函数中消耗的内存更小,因为在内存中一个类的原型只有一个,写在原型中的行为可以被所有实例共享,实例化的时候并不会在实例的内存中再复制一份而写在类中的方法,实例化的时候会在每 ...

  4. JavaScript构造函数+原型创建对象,原型链+借用构造函数模式继承父类练习

    虽然经常说是做前端开发的,但常常使用的技术反而是JQuery比较多一点.在JavaScript的使用上相对而言少些.尤其是在创建对象使用原型链继承上面,在项目开发中很少用到.所以今天做个demo练习一 ...

  5. JavaScript提高篇之面向对象之单利模式工厂模型构造函数原型链模式

    1.单例模式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. JavaScript中的 原型 property 构造函数 和实例对象之间的关系

    1 为什么要使用原型? /* * javascript当中 原型 prototype 对象 * * */ //首先引入 prototype的意义,为什么要使用这个对象 //先来写一个构造函数的面向对象 ...

  7. 深入理解Javascript中构造函数和原型对象的区别

    在 Javascript中prototype属性的详解 这篇文章中,详细介绍了构造函数的缺点以及原型(prototype),原型链(prototype chain),构造函数(constructor) ...

  8. JavaScript 类式继承与原型继承

    交叉着写Java和Javascript都有2年多了,今天来总结下自己所了解的Javascript类与继承. Javascript本身没有类似Java的面向对象的类与继承术语,但其基于原型对象的思想却可 ...

  9. javascript类继承系列二(原型链)

    原型链是采用最主要的继承方式,原理:每一个类(构造器,js中的function)都有一个原型属性(prototype)指向一个原型对象,原型对象有一个构造器(constructor),它又指回到fun ...

随机推荐

  1. C题

    C - C Time Limit:3000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu   Description   Ass ...

  2. IDE 常用快捷键记录

    一:Eclipse (1)删除当前行:Ctrl+D (2)最大化当前编辑窗口:Ctrl+m (3)关闭当前编辑器窗口:Ctrl+F4/Ctrl+w (4)导入依赖包:Ctrl+Shift+o 二:Ne ...

  3. Web应用指纹识别

    http://danqingdani.blog.163.com/blog/static/186094195201493121834603/

  4. 哎,就硬盘还不是最掉价的,1999的自配主机,VIRTUALBOX里虚拟机,聊以自慰吧。

    安装时注意的问题,要是不测试MYSQL,则CONFIGURE参数和DISABLE-MYSQL,在编译时有提示的. 然后就是LIBTOOL包过老的问题,以及未安装LIBTOOL包的问题. 最后,是运行命 ...

  5. keil优化论

    谈到优化,其实很多人都哭笑不得,因为在一个C51软件工程师的生涯中,总要被KEIL的优化耍那么一次到几次.我被耍过,想必看着文章的你也被耍过,如果你回答说不,那只能说你写的C51程序不多! 看看KEI ...

  6. Linux&shell之高级Shell脚本编程-创建菜单

    写在前面:案例.常用.归类.解释说明.(By Jim) 创建菜单#!/bin/bash# testing the scriptclearechoecho -e "\t\t\tSys Admi ...

  7. POJ3436 ACM Computer Factory(最大流)

    题目链接. 分析: 题意很难懂. 大体是这样的:给每个点的具体情况,1.容量 2.进入状态 3.出去状态.求最大流. 因为有很多点,所以如果一个点的出去状态满足另一个点的进入状态,则这两个点可以连一条 ...

  8. [GDKOI2016]小学生数学题

    记 $F(n)=\sum\limits_{i=1}^{n}i^{-1}$ $G(n)=\sum\limits_{i=1,i\neq jp}^{n}i^{-1}$ 我们要算$F(n)\%p^k$ 那么 ...

  9. XJOI——NOIP2015提高组模拟题19-day1——观光旅行

    http://www.hzxjhs.com:83/contest/493/problem/3 [题目大意] 给定一个有n(n<=500000)个点,m(1<=500000)条边的无向图.给 ...

  10. 解读sample4

    说明 被测试代码文件 sample4.h.sample4.cc 测试代码文件 sample4_unittest.cc 官网上如是描述sample4: Sample #4 is another basi ...