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是面向对象的.既然是面向对象,那它自然也有相应的类跟对象等概 ...
随机推荐
- [原创]adb使用教程v1.0-----by-----使用logcat快速抓取android崩溃日志
原文再续,书接上回:<使用logcat快速抓取android崩溃日志>中提到的工具包可以下载拉~ <使用logcat快速抓取android崩溃日志>:http://www.cn ...
- javascript的运行过程以及setTimeout的运行机制
关于javascript的运行机制大家都应该有所了解了吧,其实javascript是一个单线程的机制,但是因为队列的关系它的表现会让我们感觉是一个多线程的错觉.javascript在运行的时候是这样的 ...
- 静态代码块详解(原出处:http://versioneye.iteye.com/blog/1129579)
一 般情况下,如果有些代码必须在项目启动的时候就执行的时候,需要使用静态代码块,这种代码是主动执行的;需要在项目启动的时候就初始化,在不创建对象的情 况下,其他程序来调用的时候,需要使用静态方法,这种 ...
- Chapter 9:Noise-Estimation Algorithms
作者:桂. 时间:2017-06-14 12:08:57 链接:http://www.cnblogs.com/xingshansi/p/6956556.html 主要是<Speech enha ...
- 利用angular控制元素的显示和隐藏
<!DOCTYPE html> <html lang="en" ng-app="myapp"> <head> <met ...
- 从《海贼王》的视角走进BAT的世界(百度/阿里/腾讯)
在伟大航路后半段--新世界,有三位君临天下的海上枭雄,就犹如海上皇帝一般,被人们称为"三皇",他们是--洛宾·里(Robin·Li),杰克·马(Jack·Ma)和波尼(pony)! ...
- Jexus部署.Net Core项目
Jexus Jexus 即 Jexus Web Server,简称JWS,是Linux平台上 的一款ASP.NET WEB服务器.它是 Linux.Unix.FreeBSD 等非Windows系统架设 ...
- 关于java中使用数组的几点理解笔记
1.数组元素就是变量: 2.在已有数据类型之后加方括号[],就会产生一个新的数组类型: 分两类:1)基本数据类型,如:int[],string[]; 2)引用数据类型,如:Person[](类): 3 ...
- swiper结合ajax的轮播图
Swiper 是什么:是纯JavaScript打造的滑动特效插件,能够实现触屏焦点图.触屏tab切换.触屏多图切换等常用效果. 开源.免费.稳定.应用广泛. 这就是swiper简单的介绍,由于是结合a ...
- Spring Boot开启https
原文:https://github.com/x113773/testall/issues/1 1. 第一步就是用JDK的keytool工具来创建一个密钥存储(keystore)`keytool -ke ...