JavaScript中Function原型及其prototype属性的简单应用
大家都知道在JavaScript中是没有类的概念的,但是却是有对象的概念的。有的人可能理解对象和类有些迷糊,这里简单的概括一下他们之间的区别:
类:抽象的概念,例如人,动物,汽车等都可以抽象成一个类
对象:是指这种概念中的实体,例如“一个带着红帽子的小男孩”、“一辆红色的奔驰汽车”,“一只白色的小猫”都是实体也就是对象
实例化:就是指以类为基础构建一个实体。类所拥有的特征,其实例化对象,也一定拥有这些特征,而且实例化后可能拥有更多特征。
用Java代码表示:
/*
人
属性: 身高 height
行为: 说话 speak
*/
class Person
{
private int age;
public void setAge(int a)
{
age = a;
}
Person() //构造函数,而且是空参数
{
this.name = name;
this.age = age;
System.out.println("name="+name+" age="+age);
}
public int getAge()
{
return age;
}
void speak()
{
System.out.println("age="+age);
}
}
class PersonDemo
{
public static void main(String[] args)
{
Person p = new Person("张三",25);
}
}
//运行结果 ==> name=张三 age=25
我们在JavaScript中用到对象时是没有类的概念的,但是程序的世界里千变万化,博大精深,这里提供一种方法,可以用function构造出一种假象类,从而实现类的构造
/*
* 这里同样使用人来构造一个类
*/
function Person(name,age)
{
this.name = name;
this.age = age;
}
var people = new Person("张三",25);
下面就来介绍一下Function:
Function是由function关键字定义的函数对象的原型
在javascript中,多出了一个原型的概念。所谓原型,其实就是一个对象的本质,但复杂就复杂在,原型本身也是对象,因此,任何一个对象又可以作为其他对象的原型。Function就相当于一个系统原型,可以把它理解为一种“基本对象类型”,是“对象”这个概念范畴类的基本数据类型。除了Function之外,其实还有很多类似的首字母大写的对象原型,例如Object, Array, Image等等。有一种说法是:javascript中所有的一切都是对象(除了基本数据类型,其他的一切全是对象),所有的对象都是Object衍生出来的。(按照这种说法,我们应该返回去再思考,上面说的类的假设是否成立。)
极其重要的prototype概念
prototype的概念在javascript中极其重要,它是javascript中完成上面说的“一切皆对象”的关键。有了prototype,才有了原型,有了原型,才有了javascript五彩缤纷的世界(当然,也有人说是杂乱的)。我们可以这样去理解prototype:世界上本没有javascript,上帝说要有Object,于是有了Object,可是要有Function怎么办?只需要对Object进行扩展,可是如何扩展?只需要用prototype……当然,这是乱扯的,不过在javascript中,只要是function,就一定会有一个prototype属性。实际上确实是这样
Function.prototype.show = function() {...}
在原型的基础上通过prototype新增属性或方法,则以该对象为原型的实例化对象中,必然存在新增的属性或方法,而且它的内容是静态不可重载的。原型之所以被称为原型,可能正是因为这种不可重载的特质。
比如上面的这段代码,会导致每一个实例化的function,都会具备一个show方法。
注意上面橙色加粗的文字,每一个实例化的function,都会具备一个show方法那我们该如何使用这个方法呢?
Function.prototype.show = function()
{
return "我是一个函数的新方法"; //函数需要有返回值!
}
Function.show(); //输出=>我是一个函数的新方法
Function; //Function的原型为 =>function Function() { [native code] }
var f = new Function();
f.show(); //输出=>我是一个函数的新方法
而如果我们自己创建了一个类,则可以通过prototype将之转化为原型:
function Cat() {...}
Cat.prototype.run = function() {};
var cat1 = new Cat();
这时,对于cat1而言,Cat就是原型,而该原型拥有一个run的原始方法,所以无论实例化多少个Cat,每一个实例化对象都有run方法,而且该方法是不能被重载的,通过cat1.run = function(){}是无效的。
为了和其他语言的类的定义方法统一,我们可以将这种原型属性在定义类的时候,写在类的构造里面:
function Cat() {
....
Cat.prototype.run = function() {};
}
new Function()是函数原型的一个实例化
在理解了Function原型的概念之后,再来看new Function()就显得很容易了。
1 var message = new Function('msg','alert(msg)');
2 // 等价于:
3 function message(msg) {
4 alert(msg);
5 }
new Function(参数1,参数2,…,参数n,函数体),它的本意其实是通过实例化一个Function原型,得到一个数据类型为function的对象,也就是一个函数,而该变量就是函数名。
小结:
本文参考了 http://www.techug.com/post/utm_javascript.html 这篇文章,在笔者看到原文中说在原型的基础上通过prototype新增属性或方法,则以该对象为原型的实例化对象中,必然存在新增的属性或方法,而且它的内容是静态不可重载的这句话但是一时却不知道如何去调用新添加的方法,后来发现prototype新增方法方法里必须要有返回值,并且需要通过Function来进行调用,而且在添加show()方法后输入Function输出的结果为
function Function() { [native code] }
让我顿时理解了Function是由function关键字定义的函数对象的原型这句话,以上就是关于Function对象和prototype属性的浅要理解,不严谨之处还希望大家不吝赐教,共同学习,谢谢
JavaScript中Function原型及其prototype属性的简单应用的更多相关文章
- 深入了解JavaScript中基于原型(prototype)的继承机制
原型 前言 继承是面向对象编程中相当重要的一个概念,它对帮助代码复用起到了很大的作用. 正文 Brendan Eich在创建JavaScript时,没有选择当时最流行的类继承机制,而是借鉴Self,用 ...
- Javascript中的原型链,__proto__和prototype等问题总结
1.js中除了原始数据类型 都是对象. 包括函数也是对象,可能类似于C++函数对象把 应该是通过解释器 进行()操作符重载或其他操作, 用的时候把它当函数用就行 但是实际上本质是一个对象 原型也是一个 ...
- 【转】JavaScript中的原型和继承
请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans ...
- 【转】JavaScript中的constructor与prototype
最初对js中 object.constructor 的认识: 在学习JS的面向对象过程中,一直对constructor与prototype感到很迷惑,看了一些博客与书籍,觉得自己弄明白了,现在记录如下 ...
- Javascript中Function,Object,Prototypes,__proto__等概念详解
http://anykoro.sinaapp.com/2012/01/31/javascript%E4%B8%ADfunctionobjectprototypes__proto__%E7%AD%89% ...
- javascript中的原型继承
在Javascript面向对象编程中,原型继承不仅是一个重点也是一个不容易掌握的点.在本文中,我们将对Javascript中的原型继承进行一些探索. 基本形式 我们先来看下面一段代码: <cod ...
- 图解JavaScript中的原型链
转自:http://www.jianshu.com/p/a81692ad5b5d typeof obj 和 obj instanceof Type 在JavaScript中,我们经常用typeof o ...
- 深度剖析前端JavaScript中的原型(JS的对象原型)
这张图片有点劝退了,哈哈哈~ 通过原型机制,JavaScript 中的对象从其他对象继承功能特性:这种继承机制与经典的面向对象编程语言的继承机制不同.本文将探讨这些差别,解释原型链如 ...
- JavaScript中的原型、原型链、原型模式
今天,咱来聊聊JavaScript中的原型跟原型链 原型跟原型模式 这一块的知识,主要是设计模式方面的. 首先,我们知道JavaScript是面向对象的.既然是面向对象,那它自然也有相应的类跟对象等概 ...
随机推荐
- Delphi使用Zint生成QR二维条码(zint.dll)
Delphi使用Zint生成QRCODE 本文使用的Zint Barcode Library(zint.dll)版本为2.6.0,和之前使用的2.4.3版本在zint_symbol这个结构体上会有差异 ...
- 【锋利的jQuery】中全局事件ajaxStart、ajaxStop不执行
最近一直都在研究[锋利的jQuery],确实是一本好书,受益匪浅.但由于技术发展及版本更新等原因,里面还是有些坑需要踩的. 比如:第六章七节中提到的全局事件ajaxStart.ajaxStop照着案例 ...
- ajax 动态添加商品列表
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...
- Spring学习(13)--- 基于Java类的配置Bean 之 @Configuration & @Bean注解
基于Java配置选项,可以编写大多数的Spring不用配置XML,但有几个基于Java的注释的帮助下解释.从Spring3.0开始支持使用java代码来代替XML来配置Spring,基于Java配置S ...
- mailto调用本地默认客户端发邮件
下面介绍如何利用 Mailto功能: 实现 Mailto的基本html代码: <a href="mailto:123@qq.com">点击这里发邮件!</a> ...
- git与github的使用
git和github是两个完全不同的概念,就好比如雷锋与雷峰塔的关系. git是一个版本管理工具,用来更好的管理你的程序,比如你原来提交过的内容,以后虽然修改了,但是通过git这个工具, 可以把你原来 ...
- lvs之 lvs原理架构介绍
一. 概念 lvs的术语: Router:GWIP vs:virtual server,director rs:real server CIP:client IP VIP:virtual server ...
- php练习 租房子
题目要求 1.封装类 <?php class DBDA { public $fuwuqi="localhost"; //服务器地址 public $yonghuming=&q ...
- 自动适配H5容器(UIViewView/WKWebView),生成长图,防微信进度条
前段时间撸代码猥琐发育的时候,设计师老王给了张截图某宝APP上一个生成长图分享的功能,正好公司有这个需求,于是在立马开始操练起来!在万能的度娘上搜集整理资料后发现很多文章介绍的方案对WKWebView ...
- Python原理 -- 深浅拷贝
python原理 -- 深浅拷贝 从数据类型说开去 str, num : 一次性创建, 不能被修改, 修改即是再创建. list,tuple,dict,set : 链表,当前元素记录, 下一个元素的位 ...