详解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判断用户浏览器插件安装情况的代码
Jan 01 Javascript
VBS通过WMI监视注册表变动的代码
Oct 27 Javascript
HTML上传控件取消选择
Mar 06 Javascript
让人蛋疼的JavaScript语法特性
Sep 30 Javascript
JQuery遍历json数组的3种方法
Nov 08 Javascript
JS实现网页背景颜色与select框中颜色同时变化的方法
Feb 27 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
Apr 12 Javascript
jQuery on()方法使用技巧详解
Apr 16 Javascript
jQuery实现高亮显示网页关键词的方法
Aug 07 Javascript
jQuery弹出层后禁用底部滚动条(移动端关闭回到原位置)
Aug 29 Javascript
ES6中Proxy与Reflect实现重载(overload)的方法
Mar 30 Javascript
jQuery实现轮播图效果
Nov 26 jQuery
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
社区(php&&mysql)四
2006/10/09 PHP
php图片加水印原理(超简单的实例代码)
2013/01/18 PHP
php将textarea数据提交到mysql出现很多空格的解决方法
2014/12/19 PHP
实例讲解如何在PHP的Yii框架中进行错误和异常处理
2016/03/17 PHP
PHP实现的网站目录扫描索引工具
2016/09/08 PHP
PHP实现二维数组去重功能示例
2017/01/12 PHP
laravel实现Auth认证,登录、注册后的页面回跳方法
2019/09/30 PHP
js动态添加删除,后台取数据(示例代码)
2013/11/25 Javascript
node.js中的fs.fsync方法使用说明
2014/12/15 Javascript
js实现带按钮的上下滚动效果
2015/05/12 Javascript
在javascript中随机数 math random如何生成指定范围数值的随机数
2015/10/21 Javascript
js图片上传前预览功能(兼容所有浏览器)
2016/08/24 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
jQuery autoComplete插件两种使用方式及动态改变参数值的方法详解
2016/10/24 Javascript
JS三目运算(三元运算)方法详解
2017/03/01 Javascript
vue.js 添加 fastclick的支持方法
2018/08/28 Javascript
Vue实现固定定位图标滑动隐藏效果
2019/05/30 Javascript
javascript 构建模块化开发过程解析
2019/09/11 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
2020/06/28 Javascript
基于Vue2实现移动端图片上传、压缩、拖拽排序、拖拽删除功能
2021/01/05 Vue.js
python并发编程之线程实例解析
2017/12/27 Python
PyCharm代码回滚,恢复历史版本的解决方法
2018/10/22 Python
python实现给scatter设置颜色渐变条colorbar的方法
2018/12/13 Python
安装PyInstaller失败问题解决
2019/12/14 Python
python实现名片管理器的示例代码
2019/12/17 Python
css3实现的多级渐变下拉菜单导航效果代码
2015/08/31 HTML / CSS
如何使用html5与css3完成google涂鸦动画
2012/12/16 HTML / CSS
LA MER海蓝之谜美国官网:传奇面霜
2016/08/27 全球购物
斯洛伐克最大的婴儿食品和用品网上商店:Feedo.sk
2020/12/21 全球购物
学生鉴定评语大全
2014/05/05 职场文书
2014年团工作总结
2014/11/27 职场文书
卫生院义诊活动总结
2015/05/07 职场文书
食品安全责任书范本
2015/05/09 职场文书
《刷子李》教学反思
2016/02/20 职场文书
协议书格式模板
2016/03/24 职场文书
爱国之歌(8首)
2019/09/29 职场文书