JavaScript对象原型写法详解
体现对象原型分步式写法
//原型分步式写法
//构造函数
function Person(){}
//对象原型
Person.prototype.name = 'Avensatr';
Person.prototype.age = '22';
Person.prototype.job = 'Software Engineer';
Person.prototype.sayName = function(){
console.log(this.name);
}
我问你答?? 打印结果是??
var person = new Person();
//__proto__隐式原型与显式原型Person.prototype
console.log(person.__proto__);
console.log(Person.prototype);
//构造函数(对象原型构造用于构造对象)
console.log(Person.prototype.constructor);
console.log(Person.prototype.constructor === Person);
//构造函数原型
console.log(Person.prototype.constructor.prototype);
//对象原型
console.log(Person.prototype.__proto__);
//构造函数是由function Function(){}创建
console.log(Person.prototype.constructor.__proto__);
console.log(person.__proto__ === Person.prototype);
理清上述(实例与构造原型对象关联关系)打印结果后,见图解如下
完整图解应如下
Person.prototype只是对象指针引用,真正创建对象的是Person.prototype.constructor.prototype 构造函数原型
每个创建一个函数都有prototype属性,该函数prototype属性指向一个该函数创建的对象.即 Person.prototype.constructor.prototype
实例对象之间通过“__proto_隐式原型”与构造函数原型对象“Person.prototype”之间相关联 即person.__proto__ === Person.prototype
instanceof 用于检测对象与实例之间关系
person instanceof Person 沿着原型链person.__proto__与Person.prototype查找,若两条线能找到同一个引用,即同一个对象,则返回true,否则返回false
体现对象原型封装的写法
//原型集中写法
function Person(){}
var friends = new Person();//创建一个实例对象
Person.prototype = {
name : "Avensatr",
age : "22",
job : "Software Engineer",
sayName : function(){
console.log(this.name);
}
}
这种面向对象快捷写法 Person.prototype = {} 与上述对象原型分步式写法有所区别;本质体现在原型的重写上
Person.prototype.constrctor 不再指向 function Person(){} 而指向新的function Object() { [native code] }函数
打印结果如下图
匿名函数自执行封装对象原型方法
function Person(){}
Person.prototype = (function () {
var setName = function (name) {
return name;
},
setAge = function (age) {
return age;
},
setJob = function (job) {
return job;
};
return {
setName : setName,
setAge : setAge,
setJob : setJob
}
})();
匿名函数自执行与体现对象原型封装的写法原理是一样的,这里不再赘述
【资料参考】
http://www.sxrczx.com/docs/js/2305453.html
JavaScript高级程序设计(第三版)
JavaScript对象原型写法详解的更多相关文章
- JavaScript对象原型写法区别
体现对象原型分步式写法 //原型分步式写法 //构造函数 function Person(){} //对象原型 Person.prototype.name = 'Avensatr'; Pers ...
- JavaScript之原型深入详解
理解原型 原型是一个对象,其他对象可以通过它实现属性继承.任何一个对象都可以成为继承,所有对象在默认的情况下都有一个原型,因为原型本身也是对象,所以每个原型自身又有一个原型.任何一个对象都有一个pro ...
- 从mixin到new和prototype:Javascript原型机制详解
从mixin到new和prototype:Javascript原型机制详解 这是一篇markdown格式的文章,更好的阅读体验请访问我的github,移动端请访问我的博客 继承是为了实现方法的复用 ...
- 你不知道的JavaScript--Item15 prototype原型和原型链详解
用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了, ...
- Javascript中prototype属性详解 (存)
Javascript中prototype属性详解 在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不 ...
- Javascript常用的设计模式详解
Javascript常用的设计模式详解 阅读目录 一:理解工厂模式 二:理解单体模式 三:理解模块模式 四:理解代理模式 五:理解职责链模式 六:命令模式的理解: 七:模板方法模式 八:理解javas ...
- JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解
二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...
- Javascript 异步加载详解
Javascript 异步加载详解 本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy ...
- 【JavaScript中的this详解】
前言 this用法说难不难,有时候函数调用时,往往会搞不清楚this指向谁?那么,关于this的用法,你知道多少呢? 下面我来给大家整理一下关于this的详细分析,希望对大家有所帮助! this指向的 ...
随机推荐
- spark集群搭建
文中的所有操作都是在之前的文章scala的安装及使用文章基础上建立的,重复操作已经简写: 配置中使用了master01.slave01.slave02.slave03: 一.虚拟机中操作(启动网卡)s ...
- 异常:android.os.NetworkOnMainThreadException
场景: 安卓开发时在主线程访问网络解决: 将访问网络的代码使用Thread操作 Handler handler = new Handler(){ @Override public void handl ...
- ConstraintLayout使用
引言 ConstraintLayout是一个ViewGroup,允许您以灵活的方式定位和调整小部件的方法,项目中的布局嵌套问题对项目性能有着不小的威胁,布局能实现扁平化的话会让软件性能得到很大的提升, ...
- linux定时任务crontab 实现如何每秒执行一次!
linux crontab 命令,最小的执行时间是一分钟.如需要在小于一分钟内重复执行,可以有两个方法实现. Cron 各项的描述 以下是 crontab 文件的格式: {minute} {hour} ...
- C#自定义控件、用户控件、动态加载菜单按钮
一.效果图,动态加载5个菜单按钮: 二.实现方法 1.创建用户控件 2.在用户控件拖入toolStrip 3.进入用户控件的Lood事件,这里自动添加5个选 ToolStripMenuItem,后期 ...
- canvas-7global.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 洛谷P4926 [1007]倍杀测量者(差分约束)
题意 题目链接 Sol 题目中的两个限制条件相当于是 \[A_i \geqslant (K_i - T)B_i\] \[A_i(K_i + T) \geq B_i\] 我们需要让这两个至少有一个不满足 ...
- Python相关机器学习‘武器库’
开始学习Python,之后渐渐成为我学习工作中的第一辅助脚本语言,虽然开发语言是Java,但平时的很多文本数据处理任务都交给了Python.这些年来,接触和使用了很多Python工具包,特别是在文本处 ...
- Struts2框架原理
Struts2提供了基于MVC应用程序的开发模式,从而使应用程序结构更加清晰,同时也简化了Web应用程序的开发. Struts2的组成结构 主要包括控制器组件(包括核心控制器StrutsPrepare ...
- iOS------Xcode 的clang 扫描器可以检测出所有的内存泄露吗
在苹果没有出ARC(自动内存管理机制)时,我们几乎有一半的开发时间都耗费在这么管理内存上.后来苹果很人性的出了ARC,虽然在很大程度上,帮助我们开发者节省了精力和时间.但是我们在开发过程中,由于种种原 ...