Javascript中的Prototype到底是啥
Javascript也是面向对象的语言,但它是一种基于原型Prototype的语言,而不是基于类的语言。在Javascript中,类和对象看起来没有太多的区别。
通常,这样创建一个对象:
function person(name){
this.sayHi = function(){
alert('hi ' + this.name);
}
this.name = name;
}
var p = new person("dan");
p.sayHi();
以上,使用new关键字,通过对象(函数也是特殊对象)创建一个对象实例。
在基于类的语言中,属性或字段通常都是在类中事先定义好了,但在Javascript中,在创建对象之后还可以为类添加字段。
function animal(){}
var cat = new animal();
cat.color = "green";
以上,color这个字段只属于当前的cat实例。
对于后加的字段,如果想让animal的所有实例都拥有呢?
--使用Prototype
function animal(){}
animal.prototype.color= "green";
var cat = new animal();
var dog = new animal();
console.log(cat.color);//green
console.log(dog.color);//green
通过Prototype不仅可以添加字段,还可以添加方法。
function animal(){}
animal.prototype.color= "green";
var cat = new animal();
var dog = new animal();
console.log(cat.color);//green
console.log(dog.color);//green
animal.prototype.run = funciton(){
console.log("run");
}
dog.run();
原来通过prototype属性,在创建对象之后还可以改变对象的行为。
比如,可以为数组这个特殊对象添加一个方法。
Array.prototype.remove = function(elem){
var index = this.indexof(elem);
if(index >= 0){
this.splice(index, 1);
}
}
var arr = [1, 2, 3] ;
arr.remove(2);
除了通过prototype为对象定义属性或方法,还可以通过对象的构造函数来定义类的属性或方法。
function animal(){
this.color = "green";
this.run = function(){
console.log("run");
}
}
var mouse = new animal();
mouse.run();
以上做法的也可以让所有的animal实例共享所有的字段和方法。并且还有一个好处是可以在构造函数中使用类的局部变量。
function animal(){
var runAlready = false;
this.color = "green";
this.run = funciton(){
if(!runAlreadh){
console.log("start running");
} else {
console.log("already running")
}
}
}
其实,一个更加实际的做法是把通过构造函数结合通过prototype定义一个类的字段和行为。
function animal(){
var runAlready = false;
this.run = function(){
if(!runAlready){
console.log('i am running');
} else {
console.log("i am already running");
}
}
}
animal.prototype.color = '';
animal.prototype.hide = funciton(){
console.log("");
}
var horse = new animal();
horse.run();
horse.hide();
Prototype允许我们在创建对象之后来改变对象或类的行为,并且这些通过prototype属性添加的字段或方法所有对象实例是共享的。
Javascript中的Prototype到底是啥的更多相关文章
- Javascript中的Prototype到底是什么
Javascript也是面向对象的语言,但它是一种基于原型Prototype的语言,而不是基于类的语言.在Javascript中,类和对象看起来没有太多的区别. 什么是prototype: funct ...
- JavaScript中的prototype和__proto__细致解析
最近在学js,体会了一点点它的灵活性.对于初学者的我,总是被它的灵活感到晕头转向,最近发现了一点东西想与大家分享. JavaScript中的prototype和_proto_: 我们先了解一点js中的 ...
- JavaScript中Object.prototype.toString方法的原理
在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. ? 1 2 var arr = []; console.lo ...
- 谈谈javascript中的prototype与继承
谈谈javascript中的prototype与继承 今天想谈谈javascript中的prototype. 通常来说,javascript中的对象就是一个指向prototype的指针和一个自身的属性 ...
- Javascript中的prototype和__proto__的联系区别
转载至http://www.cnblogs.com/sinstone/p/5136871.html 一.联系 prototype和__proto__都指向原型对象,任意一个函数(包括构造函数)都有 ...
- 一文彻底搞懂JavaScript中的prototype
prototype初步认识 在学习JavaScript中,遇到了prototype,经过一番了解,知道它是可以进行动态扩展的 function Func(){}; var func1 = new Fu ...
- 深入理解Javascript中this, prototype, constructor
在Javascript面向对象编程中经常需要使用到this,prototype和constructor这3个关键字. 1.首先介绍一下this的使用:this表示当前对象;如果在全局中使用this,则 ...
- this详解:JAVASCRIPT中的this到底是谁?
语法 this 全局对象 在全局执行上下文(函数之外),this引用的是全局对象. console.log(this.document === document); // true // In web ...
- javascript中的this到底指什么?
来自百度知道解释 JavaScript:this是什么? 定义:this是包含它的函数作为方法被调用时所属的对象.说明:这句话有点咬嘴,但一个多余的字也没有,定义非常准确,我们可以分3部分来理解它!1 ...
随机推荐
- Python.Scrapy.14-scrapy-source-code-analysis-part-4
Scrapy 源代码分析系列-4 scrapy.commands 子包 子包scrapy.commands定义了在命令scrapy中使用的子命令(subcommand): bench, check, ...
- [Delphi编译错误]F2084 Internal Error: U2107
看到这个错误真是头痛,这是一个很旧的项目了,想修改下东西,清理下工程一编译出现这个该死的错误,百度了下,也没解决问题.没办法只好编译所有的BPL了. 这个项目是带包编译的,而且带了几个自己的包. ...
- js常用功能汇总
var Utils = function() { this.Tools; this.ui; }; Utils = new Utils(); Utils.prototype.Tools = { year ...
- Linux ubuntu 10.10安装OpenCv
在windows系统下已经成功做出了一个打开摄像头并检测人脸的小程序了. 开始转战linux,因为最终目标是将程序移植到嵌入式开发板上面. 但是,问题接踵而至~ 首先linux上面要安装OpenCv, ...
- Linq to SQL 基础篇
LinqtoSqlDataContext Linq = new LinqtoSqlDataContext(ConfigurationManager.ConnectionStrings["sz ...
- hdu 5748(求解最长上升子序列的两种O(nlogn)姿势)
Bellovin Time Limit: / MS (Java/Others) Memory Limit: / K (Java/Others) Total Submission(s): Accepte ...
- Eclipse程序员要掌握的常用快捷键
Ctrl+K 光标放在一个变量上(注意,是变量,如果你的光标放在了字符串上,如http://keleyi.com则没有任何作用的),按下Ctrl+K光标会定位到下一个相同的变量 Shift+Ctrl+ ...
- Q114第一颗二叉查找树(链式)
输入n,然后n个树,建立二叉查找树.从小到大输出每个节点的左右子树,空输出# #include<cstdio> #include<iostream> using namespa ...
- SQLSERVER性能监控级别步骤
SQLSERVER性能监控级别步骤 下面先用一幅图描述一下有哪些步骤和顺序 1.识别瓶颈 识别瓶颈的原因包括多个方面,例如,资源不足,需要添加或升级硬件: 工作负荷在同类资源之间分布不均匀,例如,一个 ...
- 毫无保留开源我写的:IOS Android Ipad 多点触摸通用js 库
毫无保留开源我写的:IOS Android Ipad 多点触摸通用js 库 在线演示地址: http://m.yunxunmi.com/ 支持 IOS Android Ipad 等不同操作系统的手持或 ...