浅析JavaScript函数的调用模式


Posted in Javascript onAugust 10, 2016

我们说一个函数的调用模式是作为一个函数来调用,是要与其它三种调用模式做区分
函数其他的三种调用: 方法调用模式,构造器调用模式,apply/call调用模式。 

方法的调用模式: 

var obj={
 fun1: function(){
  //方法内容
  this; //指的是window
 }
}

obj.fun1() //方法的调用

构造器的调用: 

function Person(name, age, job){
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function(){
  alert(this.name);
 };
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");

apply/call调用模式: 

function cat(){}
cat.prototype = {
 food: "fish",
 say: function(){
  alert("I love " + this.food);
 }
};

var blackCat = new cat; 
blackCat.say();

这里如果没有显性的return语句,这个新的对象则会被隐式的return,并成为这个构造器的值。 也就是说这里可以等价于: var blackCat = new cat();
但是如果我们有一个对象 

var whiteDog = {
 food: "bone"
};

我们不想对它重新定义say方法,那么我们可以通过call或apply用blackCat的say方法:
 blackCat.say.call(whiteDog);
所以,可以看出call和apply是为了动态改变this而出现的,当一个object没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。 

用的比较多的,通过document.getElementsByTagName选择的dom 节点是一种类似array的array(arguments等等)。它不能应用Array下的push,pop等方法。我们可以通过:
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));
这样domNodes就可以应用Array下的所有方法了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于JQuery的asp.net树实现代码
Nov 30 Javascript
JQUERY1.6 使用方法四 检测浏览器
Nov 23 Javascript
Javascript拓展String方法小结
Jul 08 Javascript
JS+CSS实现闪烁字体效果代码
Apr 05 Javascript
Vue 多层组件嵌套二种实现方式(测试实例)
Sep 08 Javascript
微信小程序 按钮滑动的实现方法
Sep 27 Javascript
vue中v-for加载本地静态图片方法
Mar 03 Javascript
原生js实现公告滚动效果
Jan 10 Javascript
详解VUE项目中安装和使用vant组件
Apr 28 Javascript
Node.js fs模块(文件模块)创建、删除目录(文件)读取写入文件流的方法
Sep 03 Javascript
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
antd配置config-overrides.js文件的操作
Oct 31 Javascript
JavaScript实现刷新不重记的倒计时
Aug 10 #Javascript
JavaScript中自带的 reduce()方法使用示例详解
Aug 10 #Javascript
JS控制静态页面之间传递参数获取参数并应用的简单实例
Aug 10 #Javascript
浅谈JS中的bind方法与函数柯里化
Aug 10 #Javascript
封装的dialog插件 基于bootstrap模态对话框的简单扩展
Aug 10 #Javascript
JS控制静态页面传递参数并获取参数应用
Aug 10 #Javascript
基于JavaScript实现树形下拉框
Aug 10 #Javascript
You might like
laravel 字段格式化 modle 字段类型转换方法
2019/09/30 PHP
用倒置滤镜把div倒置,再把table倒置。
2007/07/31 Javascript
javascript学习笔记(二十) 获得和设置元素的特性(属性)
2012/06/20 Javascript
Js表格万条数据瞬间加载实现代码
2014/02/20 Javascript
jQuery实现回车键(Enter)切换文本框焦点的代码实例
2014/05/05 Javascript
详解javascript实现瀑布流列式布局
2016/01/29 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
2016/06/14 Javascript
angular分页指令操作
2017/01/09 Javascript
Angular2监听页面大小变化的解决方法
2017/10/09 Javascript
vue2中使用sass并配置全局的sass样式变量的方法
2018/09/04 Javascript
使用JavaScript解析URL的方法示例
2019/03/01 Javascript
微信小程序第三方框架对比 之 wepy / mpvue / taro
2019/04/10 Javascript
AngularJs中$cookies简单用法分析
2019/05/30 Javascript
vue中keep-alive组件的入门使用教程
2019/06/06 Javascript
python正则表达式及使用正则表达式的例子
2018/01/22 Python
Python结合ImageMagick实现多张图片合并为一个pdf文件的方法
2018/04/24 Python
Numpy array数据的增、删、改、查实例
2018/06/04 Python
Python实现自动访问网页的例子
2020/02/21 Python
python继承threading.Thread实现有返回值的子类实例
2020/05/02 Python
PyCharm2019 安装和配置教程详解附激活码
2020/07/31 Python
python如何对链表操作
2020/10/10 Python
python实现磁盘日志清理的示例
2020/11/05 Python
在HTML5 Canvas中放入图片和保存为图片的方法
2014/05/03 HTML / CSS
佐卡伊官网:中国知名珠宝品牌
2017/02/05 全球购物
新电JAVA笔试题目
2014/08/31 面试题
Java servlet面试题
2012/03/04 面试题
比赛口号大全
2014/06/10 职场文书
不尊敬老师检讨书范文
2014/11/19 职场文书
2015年幼儿园班务工作总结
2015/05/12 职场文书
2015年校医个人工作总结
2015/07/24 职场文书
婚宴新娘致辞
2015/07/28 职场文书
html+css实现赛博朋克风格按钮
2021/05/26 HTML / CSS
Kubernetes部署实例并配置Deployment、网络映射、副本集
2022/04/01 Servers
CDPR谈《巫师》新作用虚幻5原因 称不会为Epic独占
2022/04/06 其他游戏
利用Python实时获取steam特惠游戏数据
2022/06/25 Python
JavaScript实现九宫格拖拽效果
2022/06/28 Javascript