浅谈JavaScript函数的四种存在形态


Posted in Javascript onJune 08, 2016

函数的四种存在形态:

1.函数形态

2.方法形态 将函数赋值给某一个对象的成员,那么就称为方法

3.构造器形态

4.上下文形态

1.函数形态:

var foo = function() {
  alert(this);       //this是window
};

2.方法形态:

 

o = {};
o.foo = foo;  //将函数foo赋值给对象o的foo属性
o.foo();    //弹出的是object,此时的this表示object

 

var lib = {
  test:function() {
    alert(this);     //此处的this表示object(lib对象本身)
    //var that = this;  //要想匿名函数中this表示lib对象,可以这样
    (function() {
     alert(this);    //此处的匿名函数不属于lib对象,所以this的任然表示window
    })();
  }
};
lib.test();

3.构造器(构造函数)var p = new Person();

1、new创建了对象,并开辟了空间

2、将对象的引用地址传递给函数,在函数中用this接收

3、构造方法执行结束,返回this

var Person = function() {
  this.age = 19;
  this.name = "Mr靖";
  return "{}";
};

var p = new Person();
alert(p.name);  //弹出的是undefined,由于函数返回的是一个对象,所以直接将这个对象返回给person,而忽略age,name属性
var Person = function() {
  this.age = 19;
  this.name = "Mr靖";
  return 123;
};

var p = new Person();
alert(p.name);  //弹出“Mr靖”,由于返回值不是对象,所以直接忽略返回值
alert(p);      //弹出object

改变的东西有:构造函数改变了函数的返回值;如果函数的返回值是一个对象,那么就按照返回值来返回;如果返回值不是一个对象就忽略返回值,直接返回this;

4.上下文调用模式函数.apply(对象, [参数列表])

var foo1 = function(a, b) {
  alert(this);
  return a > b ? a : b;
};
var num = foo1.apply(null, [112, 34]);   //此时foo1是函数形态,this表示window
num = foo1.apply({}, [112, 34]);      //此时foo1是方法形态,this表示参数中传入的对象{}

函数.call(对象, 参数列表);

var num1 =foo1.call(null,112,34);
num1=foo1.call({},112,34);      //除了参数列表外,其余和apply一样

以上这篇浅谈JavaScript函数的四种存在形态就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery textarea的长度进行验证
May 06 Javascript
基于jquery的direction图片渐变动画效果
May 24 Javascript
自己动手制作jquery插件之自动添加删除行功能介绍
Oct 14 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
May 23 Javascript
JQuery异步加载无限下拉框级联功能实现示例
Feb 19 Javascript
分享12个实用的jQuery代码片段
Mar 09 Javascript
Vue.js动态组件解析
Sep 09 Javascript
jQuery使用Layer弹出层插件闪退问题
Dec 22 Javascript
Angularjs中ng-repeat-start与ng-repeat-end的用法实例介绍
Dec 31 Javascript
jquery实现多次上传同一张图片
Jan 09 Javascript
js实现PC端根据IP定位当前城市地理位置
Feb 22 Javascript
AngularJS基于MVC的复杂操作实例讲解
Dec 31 Javascript
jQuery Ajax和getJSON获取后台普通json数据和层级json数据用法分析
Jun 08 #Javascript
关于session和cookie的简单理解
Jun 08 #Javascript
jQuery封装的屏幕居中提示信息代码
Jun 08 #Javascript
Ext JS框架程序中阻止键盘触发回退或者刷新页面的代码分享
Jun 07 #Javascript
JavaScript基础语法之js表达式
Jun 07 #Javascript
JavaScript必看小技巧(必看)
Jun 07 #Javascript
通过正则表达式获取url中参数的简单实现
Jun 07 #Javascript
You might like
php的字符串用法小结
2010/06/08 PHP
Php中用PDO查询Mysql来避免SQL注入风险的方法
2013/04/25 PHP
jscript之List Excel Color Values
2007/06/13 Javascript
jQuery模拟超链接点击效果代码
2013/04/21 Javascript
JavaScript实现在标题栏上显示当前日期的方法
2015/03/19 Javascript
js操作table元素实现表格行列新增、删除技巧总结
2015/11/18 Javascript
实例详解jQuery表单验证插件validate
2016/01/18 Javascript
js计算系统当前日期是星期几的方法
2016/07/14 Javascript
js 弹出虚拟键盘修改密码的简单实例
2016/10/10 Javascript
从零学习node.js之模块规范(一)
2017/02/21 Javascript
JS获取短信验证码倒计时的实现代码
2017/05/22 Javascript
webpack配置sass模块的加载的方法
2017/07/30 Javascript
浅谈Vue 初始化性能优化
2017/08/31 Javascript
vue2 前端搜索实现示例
2018/02/26 Javascript
Javascript获取某个月的天数
2018/05/30 Javascript
vue移动端轻量级的轮播组件实现代码
2018/07/12 Javascript
angular4中*ngFor不能对返回来的对象进行循环的解决方法
2018/09/12 Javascript
nodejs实现日志读取、日志查找及日志刷新的方法分析
2019/05/20 NodeJs
Python的Urllib库的基本使用教程
2015/04/30 Python
Python中urllib+urllib2+cookielib模块编写爬虫实战
2016/01/20 Python
Python中使用OpenCV库来进行简单的气象学遥感影像计算
2016/02/19 Python
Python检测生僻字的实现方法
2016/10/23 Python
python 找出list中最大或者最小几个数的索引方法
2018/10/30 Python
python求解汉诺塔游戏
2020/07/09 Python
Python中openpyxl实现vlookup函数的实例
2020/10/28 Python
Python之京东商品秒杀的实现示例
2021/01/06 Python
使用 css3 transform 属性来变换背景图的方法
2019/05/07 HTML / CSS
html5的pushstate以及监听浏览器返回事件的实现
2020/08/11 HTML / CSS
Joules美国官网:出色的英国风格
2017/10/30 全球购物
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
擅自离岗检讨书
2014/02/11 职场文书
关于清明节的演讲稿
2014/09/13 职场文书
大学生学习计划书
2014/09/15 职场文书
《领导干部从政道德启示录》学习心得体会
2016/01/20 职场文书
《游戏公平》教学反思
2016/02/20 职场文书
vue基于Teleport实现Modal组件
2021/05/31 Vue.js