谈谈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 相关文章推荐
JavaScript多线程的实现方法
May 08 Javascript
零基础学JavaScript最新动画教程+iso光盘下载
Jan 22 Javascript
jquery进行数组遍历如何跳出当前的each循环
Jun 05 Javascript
浅谈Sizzle的“编译原理”
Apr 14 Javascript
体验jQuery和AngularJS的不同点及AngularJS的迷人之处
Feb 02 Javascript
js验证框架实现代码分享
May 18 Javascript
漂亮实用的页面loading(加载)封装代码
Feb 03 Javascript
webpack打包node.js后端项目的方法
Mar 10 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
Jun 17 Javascript
微信小程序image图片加载完成监听
Aug 31 Javascript
vant IndexBar实现的城市列表的示例代码
Nov 20 Javascript
解决vue项目中出现Invalid Host header的问题
Nov 17 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
2006/10/09 PHP
编写自己的php扩展函数
2006/10/09 PHP
PHP命名空间(Namespace)简明教程
2014/06/11 PHP
Laravel搭建后台登录系统步骤详解
2016/07/26 PHP
JavaScript 弹出窗体点击按钮返回选择数据的实现
2010/04/01 Javascript
利用jQuery操作对象数组的实现代码
2011/04/27 Javascript
js replace正则表达式应用案例讲解
2013/01/17 Javascript
不要使用jQuery触发原生事件的方法
2014/03/03 Javascript
js中自定义方法实现停留几秒sleep
2014/07/11 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
浅谈jQuery中ajaxPrefilter的应用
2016/08/01 Javascript
详解JS异步加载的三种方式
2017/03/07 Javascript
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
2017/08/18 jQuery
webpack踩坑之路图片的路径与打包
2017/09/05 Javascript
AngularJS 表单验证手机号的实例(非必填)
2017/11/12 Javascript
判断jQuery是否加载完成,没完成继续判断的解决方法
2017/12/06 jQuery
vue、react等单页面项目部署到服务器的方法及vue和react的区别
2018/09/29 Javascript
微信小程序实现侧边分类栏
2019/10/21 Javascript
react-native 实现购物车滑动删除效果的示例代码
2021/01/15 Javascript
[37:45]完美世界DOTA2联赛PWL S3 LBZS vs Phoenix 第二场 12.09
2020/12/11 DOTA
Python实现提取文章摘要的方法
2015/04/21 Python
Python升级导致yum、pip报错的解决方法
2017/09/06 Python
django中瀑布流写法实例代码
2019/10/14 Python
查看keras的默认backend实现方式
2020/06/19 Python
python3排序的实例方法
2020/10/20 Python
Python3 用matplotlib绘制sigmoid函数的案例
2020/12/11 Python
python字典按照value排序方法
2020/12/28 Python
欧舒丹英国官网:购买欧舒丹护手霜等明星产品
2017/01/17 全球购物
德购商城:德国进口直邮商城
2017/06/13 全球购物
JENNIFER BEHR官网:各种耳环和发饰
2020/06/07 全球购物
澳大利亚厨房和家用电器购物网站:Bing Lee
2021/01/11 全球购物
工厂实习感言
2014/01/14 职场文书
大学生职业规划书的范本
2014/02/18 职场文书
聚众斗殴罪辩护词
2015/05/21 职场文书
公司欠款证明
2015/06/24 职场文书
[有人@你]你有一封绿色倡议书,请查收!
2019/07/18 职场文书