谈谈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最常用与实用的创建类的代码
Aug 12 Javascript
js对象关系图 方便dom操作
Mar 18 Javascript
解析dom中的children对象数组元素firstChild,lastChild的使用
Jul 10 Javascript
Js为表单动态添加节点内容的方法
Feb 10 Javascript
jquery动态遍历Json对象的属性和值的方法
Jul 27 Javascript
JS查找字符串中出现次数最多的字符
Sep 05 Javascript
vue.js国际化 vue-i18n插件的使用详解
Jul 07 Javascript
JavaScript中创建原子的方法总结
Aug 26 Javascript
Angular4.0动画操作实例详解
May 10 Javascript
gulp构建小程序的方法步骤
May 31 Javascript
详解微信小程序支付流程与梳理
Jul 16 Javascript
JavaScript 获取滚动条位置并将页面滑动到锚点
Feb 08 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 后端实现JWT认证方法示例
2018/09/04 PHP
laravel excel 上传文件保存到本地服务器功能
2019/11/14 PHP
JQuery 学习笔记 选择器之三
2009/07/23 Javascript
JavaScript 创建对象和构造类实现代码
2009/07/30 Javascript
js跟随滚动条滚动浮动代码
2009/12/31 Javascript
javascript getElementsByTagName
2011/01/31 Javascript
用JQuery 判断某个属性是否存在hasAttr的解决方法
2013/04/26 Javascript
js sort 二维数组排序的用法小结
2014/01/24 Javascript
深入学习JavaScript中的原型prototype
2015/08/13 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
JavaScript事件详细讲解
2016/06/27 Javascript
Angular 应用技巧总结
2016/09/14 Javascript
jQuery时间验证和转换为标准格式的时间格式
2017/03/06 Javascript
Vue中img的src属性绑定与static文件夹实例
2017/05/18 Javascript
小程序开发基础之view视图容器
2018/08/21 Javascript
Vue press 支持图片放大功能的实例代码
2018/11/09 Javascript
通过seajs实现JavaScript的模块开发及按模块加载
2019/06/06 Javascript
[01:22]DOTA2神秘商店携大量周边降临完美大师赛
2017/11/07 DOTA
跟老齐学Python之模块的加载
2014/10/24 Python
详解Python中with语句的用法
2015/04/15 Python
Python中常见的数据类型小结
2015/08/29 Python
浅谈numpy库的常用基本操作方法
2018/01/09 Python
使用python 爬虫抓站的一些技巧总结
2018/01/10 Python
Python cookbook(数据结构与算法)实现对不原生支持比较操作的对象排序算法示例
2018/03/15 Python
在windows下Python打印彩色字体的方法
2018/05/15 Python
python用opencv批量截取图像指定区域的方法
2019/01/24 Python
使用python读取.text文件特定行的数据方法
2019/01/28 Python
有趣的流行文化T恤、马克杯、手机壳和更多:Look Human
2019/01/07 全球购物
大专毕业生简历的自我评价
2013/10/20 职场文书
《维生素c的故事》教学反思
2014/02/18 职场文书
放飞梦想演讲稿800字
2014/08/26 职场文书
开发房地产协议书
2014/09/14 职场文书
代理人委托书
2014/09/16 职场文书
企业计划生育责任书
2015/05/09 职场文书
Django 如何实现文件上传下载
2021/04/08 Python
Nginx文件已经存在全局反向代理问题排查记录
2022/07/15 Servers