谈谈JavaScript的New关键字


Posted in Javascript onAugust 26, 2016

原型和闭包算是JavaScript中最常见,最难以理解,最容易被当做问题的两个部分,当然还有它们的延伸,如作用域链,继承等等吧,我最近也是各种看,各种翻,记录点自己的心得,写写总会让自己的理解更深一些。(跟标题的关系不大啦,就感慨句,每次总感觉自己懂了,再翻还是收获满满)

先谈一下JavaScript中New关键字吧,通常我们通过它来创建一个类的实例对象,在JavaScript中,实例化对象之后,也就继承了类的属性以及方法。通过代码来演示一下 

function Person(name){
 this.name = name;
}
Person.age= "23";
Person.prototype.say = function(){
 console.log("I'm " + this.name);
};
var person= new Person("王方");
 
console.log(
 person.name, //王方
 person.height //undefined
);
person.say(); //I'm 王方
 
console.log(
 Person.name, //Person
 Person.age//23
);
Person.say(); //Person.say is not a function

我们看下这一行 
var person= new Person("王方");
new 到底做了什么呢?恩 JS引擎做的工作就是下面这样  

var obj = {};
obj.__proto__ = Person.prototype;
var result = Person.call(obj,"王方");
return typeof result === 'obj'? result : obj;

1.首先创建一个新对象 

2.把obj的__proto__ 指向Person的原型对象prototype,此时便建立了obj对象的原型链:obj->Person.prototype->Object.prototype->null 

3.在obj对象的执行空间调用Person函数并传递参数“王方”。 相当于var result = obj.Person("王方")。当这句执行完之后,obj便产生了属性name并赋值为"王方"。 

4.判断返回值,如果无返回值或者返回一个非对象值,就将obj返回,否则讲返回值作为新对象返回(有点绕口,三元运算符,自己看下吧) 

总结:
 Javascript的new关键字主要的作用是继承,如上例子所言,但是要记住一点,Person是一个函数,而person是一个对象,至于函数与对象之间的区别,我有时间再写吧。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 事件小结 表格区别
Aug 13 Javascript
javascript 面向对象思想 附源码
Jul 07 Javascript
jquery 模拟雅虎首页的点击对话框效果
Apr 11 Javascript
轻量级 JS ToolTip提示效果
Jul 20 Javascript
仿微博字符限制效果实现代码
Apr 20 Javascript
利用JQuery动画制作滑动菜单项效果实现步骤及代码
Feb 07 Javascript
用js来获取上传的文件名纯粹是为了美化而用
Oct 23 Javascript
js读取csv文件并使用json显示出来
Jan 09 Javascript
JS+CSS实现滚动数字时钟效果
Dec 25 Javascript
浅谈es6中export和export default的作用及区别
Feb 07 Javascript
node.js实现上传文件功能
Jul 15 Javascript
使用xampp将angular项目运行在web服务器的教程
Sep 16 Javascript
JavaScript数组去重由慢到快由繁到简(优化篇)
Aug 26 #Javascript
针对JavaScript中this指向的简单理解
Aug 26 #Javascript
轻松掌握JavaScript代理模式
Aug 26 #Javascript
轻松掌握JavaScript单例模式
Aug 25 #Javascript
很酷的星级评分系统原生JS实现
Aug 25 #Javascript
jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法
Aug 25 #Javascript
轻松掌握JavaScript策略模式
Aug 25 #Javascript
You might like
浅析PHP绘图技术
2013/07/03 PHP
php中使用base HTTP验证的方法
2015/04/20 PHP
yii通过小物件生成view的方法
2016/10/08 PHP
php实现小程序支付完整版
2018/10/09 PHP
PHP如何使用array_unshift()在数组开头插入元素
2020/09/01 PHP
使用Mootools动态添加Css样式表代码,兼容各浏览器
2011/12/12 Javascript
JavaScript 上万关键字瞬间匹配实现代码
2013/07/07 Javascript
jQuery学习之prop和attr的区别示例介绍
2013/11/15 Javascript
jquery实现选中单选按钮下拉伸缩效果
2015/08/06 Javascript
跟我学习javascript的全局变量
2015/11/16 Javascript
基于jQuery实现的仿百度首页滑动选项卡效果代码
2015/11/16 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
2016/06/07 Javascript
EditPlus中的正则表达式 实战(4)
2016/12/15 Javascript
bootstrapvalidator之API学习教程
2017/06/29 Javascript
AngularJS实现的JSONP跨域访问数据传输功能详解
2017/07/20 Javascript
JavaScript图片处理与合成总结
2018/03/04 Javascript
layui+jquery支持IE8的表格分页方法
2019/09/28 jQuery
原生JavaScript实现刮刮乐
2020/09/29 Javascript
[27:53]2014 DOTA2华西杯精英邀请赛 5 24 NewBee VS iG
2014/05/26 DOTA
基于python(urlparse)模板的使用方法总结
2017/10/13 Python
python opencv 图像尺寸变换方法
2018/04/02 Python
Python代码块批量添加Tab缩进的方法
2018/06/25 Python
python提取具有某种特定字符串的行数据方法
2018/12/11 Python
python基础 range的用法解析
2019/08/23 Python
Tensorflow分批量读取数据教程
2020/02/07 Python
解析python 类方法、对象方法、静态方法
2020/08/15 Python
利用canvas实现图片下载功能来实现浏览器兼容问题
2019/05/31 HTML / CSS
流行文化收藏品:Sideshow(DC漫画,星球大战,漫威)
2019/03/17 全球购物
护理专科毕业推荐信
2013/11/10 职场文书
巡警年度自我鉴定
2014/02/21 职场文书
带病坚持工作事迹
2014/05/03 职场文书
高一学年自我鉴定范文(3篇)
2014/09/26 职场文书
机关作风整顿个人剖析材料
2014/10/06 职场文书
2014年质检工作总结
2014/11/26 职场文书
Python使用random模块实现掷骰子游戏的示例代码
2021/04/29 Python
详解MySQL多版本并发控制机制(MVCC)源码
2021/06/23 MySQL