详解JS构造函数中this和return


Posted in Javascript onSeptember 16, 2017

先看一段代码,

function Foo(name,age){
  this.name=name;
  this.age=age;
}
var foo=new Foo("Tom",14);
foo.name;//Tom
foo.age;//14

使用构造函数实例化发生的流程:

1.建立一个foo的空对象。

2.将构造函数中的Foo的this指向对象foo。

3.foo的_proto_属性指向Foo函数的prototype原型。

4.执行构造函数中的代码。

相对于普通函数,构造函数中的this是指向实例的,而普通函数调用中的this是指向windows的。

构造函数中如果加入了return的话,分两种情况

function Foo(name,age){
  this.name=name;
  this.age=age;
  return {name:"Jeff"}
}
var foo=new Foo("Tom",14);
foo.name;//Jeff

1.return的是五种简单数据类型:String,Number,Boolean,Null,Undefined。

这种情况下,忽视return值,依然返回this对象。

2.return的是Object。

 这种情况下,不再返回this对象,而是返回return语句的返回值。

总结

以上所述是小编给大家介绍的JS构造函数中this和return,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言小编会及时回复大家的!

Javascript 相关文章推荐
Javascript中string转date示例代码
Nov 01 Javascript
jquery实现的鼠标拖动排序Li或Table
May 04 Javascript
jQuery中width()方法用法实例
Dec 24 Javascript
快速解决js中window.location.href不工作的问题
Nov 02 Javascript
Vue axios 中提交表单数据(含上传文件)
Jul 06 Javascript
使用react context 实现vue插槽slot功能
Jul 18 Javascript
JS实现页面跳转与刷新的方法汇总
Aug 30 Javascript
vue 解决form表单提交但不跳转页面的问题
Oct 30 Javascript
基于vue-draggable 实现三级拖动排序效果
Jan 10 Javascript
vue-iview动态新增和删除的方法
Jun 17 Javascript
解决idea开发遇到javascript动态添加html元素时中文乱码的问题
Sep 29 Javascript
JavaScript大数相加相乘的实现方法实例
Oct 18 Javascript
Angular使用Md5加密的解决方法
Sep 16 #Javascript
使用JS实现气泡跟随鼠标移动的动画效果
Sep 16 #Javascript
EasyUI创建人员树的实例代码
Sep 15 #Javascript
webpack构建react多页面应用详解
Sep 15 #Javascript
详解Vue中一种简易路由传参办法
Sep 15 #Javascript
JavaScript实现换肤功能
Sep 15 #Javascript
jQuery实现火车票买票城市选择切换功能
Sep 15 #jQuery
You might like
别人整理的服务器变量:$_SERVER
2006/10/20 PHP
用php实现百度网盘图片直链的代码分享
2012/11/01 PHP
PHP利用超级全局变量$_GET来接收表单数据的实例
2016/11/05 PHP
php unlink()函数使用教程
2018/07/12 PHP
索趣科技的答案
2007/02/07 Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
2011/03/03 Javascript
深入分析js中的constructor和prototype
2012/04/07 Javascript
jquery验证手机号码、邮箱格式是否正确示例代码
2013/07/28 Javascript
JS实现随机数生成算法示例代码
2013/08/08 Javascript
jQuery+easyui中的combobox实现下拉框特效
2015/02/27 Javascript
js实现背景图自适应窗口大小
2017/01/10 Javascript
Javascript循环删除数组中元素的几种方法示例
2017/05/18 Javascript
利用Node.js检测端口是否被占用的方法
2017/12/07 Javascript
AngularJS 应用模块化的使用
2018/04/04 Javascript
pm2发布node配置文件ecosystem.json详解
2019/05/15 Javascript
原生JS与CSS实现软件卸载对话框功能
2019/12/05 Javascript
微信小程序返回上一页传参并刷新过程解析
2019/12/13 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
2020/04/28 Javascript
Python 匹配任意字符(包括换行符)的正则表达式写法
2009/10/29 Python
python异常和文件处理机制详解
2016/07/19 Python
Python 和 JS 有哪些相同之处
2017/11/23 Python
Python登录注册验证功能实现
2018/06/18 Python
通过python将大量文件按修改时间分类的方法
2018/10/17 Python
python用post访问restful服务接口的方法
2018/12/07 Python
Python基于traceback模块获取异常信息
2020/07/23 Python
如何用Django处理gzip数据流
2021/01/29 Python
python实现图片转字符画的完整代码
2021/02/21 Python
CSS3 animation实现逐帧动画效果
2016/06/02 HTML / CSS
html5中 media(播放器)的api使用指南
2014/12/26 HTML / CSS
可持续未来的时尚基础:Alternative Apparel
2019/05/06 全球购物
英国设计师泳装、沙滩装和比基尼在线精品店:Beach Cafe
2019/08/28 全球购物
查询优化的一般准则有哪些
2015/03/08 面试题
CSS3实现的3D隧道效果
2021/04/27 HTML / CSS
JavaWeb 入门篇:创建Web项目,Idea配置tomcat
2021/07/16 Java/Android
Python极值整数的边界探讨分析
2021/09/15 Python
Python编写车票订购系统 Python实现快递收费系统
2022/08/14 Python