详解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 Length 属性的总结
Nov 02 Javascript
jQuery实现下拉加载功能实例代码
Apr 01 Javascript
有关jQuery中parent()和siblings()的小问题
Jun 01 Javascript
jQuery+Ajax实现限制查询间隔的方法
Jun 07 Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
Jun 20 Javascript
jQuery手指滑动轮播效果
Dec 22 Javascript
详解vue-cli项目中怎么使用mock数据
May 29 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
Oct 23 Javascript
详解使用Nuxt.js快速搭建服务端渲染(SSR)应用
Mar 13 Javascript
JavaScript进阶(四)原型与原型链用法实例分析
May 09 Javascript
原生JS实现无缝轮播图片
Jun 24 Javascript
vue2.0实现列表数据增加和删除
Jun 17 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
使用PHP实现二分查找算法代码分享
2011/06/24 PHP
redis查看连接数及php模拟并发创建redis连接的方法
2016/12/15 PHP
用JS提交参数创建form表单在FireFox中遇到的问题
2013/01/16 Javascript
如何阻止复制剪切和粘贴事件为了表单内容的安全
2013/05/23 Javascript
简约JS日历控件 实例代码
2013/07/12 Javascript
仿新浪微博登陆邮箱提示效果的js代码
2013/08/02 Javascript
jQuery实现等比例缩放大图片让大图片自适应页面布局
2013/10/16 Javascript
B/S模式项目中常用的javascript汇总
2013/12/17 Javascript
Javascript浅谈之this
2013/12/17 Javascript
深入探密Javascript数组方法
2015/01/08 Javascript
js完美解决IE6不支持position:fixed的bug
2015/04/24 Javascript
JS选中checkbox后获取table内一行TD所有数据的方法
2015/07/01 Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
2015/12/18 Javascript
BootStrap中Tab页签切换实例代码
2016/05/30 Javascript
vue2.0 better-scroll 实现移动端滑动的示例代码
2018/01/25 Javascript
vue+iview+less+echarts实战项目总结
2018/02/22 Javascript
vue 1.0 结合animate.css定义动画效果
2018/07/11 Javascript
Vuejs 实现简易 todoList 功能 与 组件实例代码
2018/09/10 Javascript
ES6 新增的创建数组的方法(小结)
2019/08/01 Javascript
解决layui使用layui-icon出现默认图标的问题
2019/09/11 Javascript
[48:12]Secret vs Optic Supermajor 胜者组 BO3 第三场 6.4
2018/06/05 DOTA
python分析网页上所有超链接的方法
2015/05/08 Python
基于python代码实现简易滤除数字的方法
2018/07/17 Python
Python面向对象之静态属性、类方法与静态方法分析
2018/08/24 Python
不管你的Python报什么错,用这个模块就能正常运行
2018/09/14 Python
Python对CSV、Excel、txt、dat文件的处理
2018/09/18 Python
实例讲解python中的协程
2018/10/08 Python
Django接收自定义http header过程详解
2019/08/23 Python
浅谈Html5多线程开发之WebWorkers
2018/05/02 HTML / CSS
详解如何获取localStorage最大存储大小的方法
2020/05/21 HTML / CSS
Booking.com德国:预订最好的酒店和住宿
2020/02/16 全球购物
地球鞋加拿大官网:Earth Shoes Canada
2020/11/17 全球购物
国贸专业个人求职信分享
2013/12/04 职场文书
项目总经理岗位职责
2014/02/14 职场文书
月度优秀员工获奖感言
2014/08/16 职场文书
英语演讲开场白
2015/05/29 职场文书