第196天:js---调用函数的五种方式
一、普通方式
/*普通模式*/
// 声明一个函数,并调用
function func() {
console.log("Hello World");
}
func();
二、函数表达式
/*函数表达式*/
// 使用函数的Lambda表达式定义函数,然后调用
var func = function() {
console.log("你好,百度一下");
};
func(); //可以发现函数调用很简单,就是平时学习的一样.
//这里的关键是,在函数调用模式中,函数里的 this 关键字指全局对象,
//如果在浏览器中就是 window 对象. 例如:
var func = function() {
console.log(this);
};
func();
// 此时,会弹出对话框,打印出 [object Window]
三、方法调用模式
/*方法调用模式*/
//函数调用模式很简单,是最基本的调用方式.
//但是同样的是函数,将其赋值给一个对象的成员以后,就不一样了.
//将函数赋值给对象的成员后,那么这个就不在称为函数,而应该叫做方法. // 定义一个函数
var func = function() {
alert("我是一个函数么?");
}; // 将其赋值给一个对象
var o = {};
o.fn = func; // 注意这里不要加圆括号
// 调用
o.fn(); //此时,o.fn 则是方法,不是函数了.
//实际上 fn 的方法体与 func 是一模一样的,但是这里有个微妙的不同. 看下面的代码:
// 接上面的代码
alert(o.fn === func);
//打印结果是 true ,这个表明两个函数是一样的东西. 但是修改一下函数的代码: // 修改函数体
var func = function() {
alert(this);
};
var o = {};
o.fn = func;
// 比较
alert(o.fn === func);
// 调用
func();
o.fn();
// 这里的运行结果是,两个函数是相同的,因此打印结果是 true.
// 但是由于两个函数的调用是不一样的,
// func的调用,打印的是 [object Window],而o.fn 的打印结果是[object Object].
// 这里便是函数调用与方法调用的区别.
// 函数调用中,this专指全局对象window,
// 而在方法中this专指当前对象. 即o.fn 中的this 指的就是对象o.
四、构造函数调用模式
/*构造函数调用模式*/
// 同样是函数,在单纯的函数模式下,this表示window;
// 在对象方法模式下,this指的是当前对象.
// 除了这两种情况,JavaScript中函数还可以是构造器.
// 将函数作为构造器来使用的语法就是在函数调用前面加上一个new关键字. 如代码:
// 定义一个构造函数
var Person = function() {
this.name = "百度一下";
this.sayHello = function() {
alert("你好,这里是" + this.name);
};
};
// 调用构造器,创建对象
var p = new Person();
// 使用对象
p.sayHello();
// 上面的案例首先创建一个构造函数Person,然后使用构造函数创建对象p.
// 这里使用 new语法.然后使用对象调用sayHello()方法.
// 这个使用构造函数创建对象的案例比较简单. 从案例可以看到,此时 this指的是对象本身.
五、apply、call调用模式
上篇中详细讲解了。
第196天:js---调用函数的五种方式的更多相关文章
- JS调用函数的两种方式
<script type="text/javascript"> window.onload = init; //onload 表示页面全部加载完毕后,再调用init() ...
- JS定义函数的2种方式以及区别简述(为什么推荐第二种方式)
无意中看到了阮一峰大神多年前的一篇博客: 12种不宜使用的Javascript语法 看到第9条的时候受到了启发,感觉之前没怎么理解清楚的一些问题好像突然就清晰了,如下图 可能光这样看,有些小伙 ...
- JS定义函数的两种方式:函数声明和函数表达式
函数声明 关于函数声明的方式,它的一个重要的特性就是函数声明提升(function declaration hoisting),意思是在执行代码之前会先读取函数声明.这就意味着可以把函数声明放在调用它 ...
- js实现继承的五种方式
function Parent(firstname) { this.fname=firstname; ; this.sayAge=function() { console.log(this.age); ...
- JS调用webservice的两种方式
协议肯定是使用http协议,因为soap协议本身也是基于http协议.期中第二种方式:只有webservice3.5以后版本才可以成功 第一种方式:构造soap格式的body,注意加粗的黄色标识,比如 ...
- js中声明Number的五种方式
转载自:http://www.jb51.net/article/34191.htm <!DOCTYPE html> <html> <head> <meta c ...
- js setTimeout 传递带参数的函数的2种方式
js setTimeout 传递带参数的函数的2种方式 Created by Marydon on 2018年9月14日 1.准备工作 function sayYourName(param) { ...
- resize函数有五种插值算法
转自http://blog.csdn.net/fengbingchun/article/details/17335477 最新版OpenCV2.4.7中,cv::resize函数有五种插值算法:最近邻 ...
- JS创建对象,数组,函数的三种方式
害怕自己忘记,简单总结一下 创建对象的3种方法 ①:创建一个空对象 var obj = {}; ②:对象字面量 var obj = { name: "Tom", age: 27 ...
随机推荐
- 20155216 2017-2018-1 《信息安全系统设计基础》第二周课堂练习补交以及Myod的实现
20155216 2017-2018-1 <信息安全系统设计基础>第二周课堂练习补交 课堂测试3:行断点的设置 运行截图: 未完成原因:课前未安装 cgdb 具体步骤: 1.输入命令:gc ...
- 20155229实验三 《Java面向对象程序设计实验三 敏捷开发与XP实践 》实验报告
实验题目 1.在IDEA中使用工具(Code->Reformate Code)把下面代码重新格式化,再研究一下Code菜单,找出一项让自己感觉最好用的功能. 2.下载搭档实验二的Complex代 ...
- # 20155337 2017-2018-1 《信息安全系统设计基础》第二周课堂实践+myod
20155337 2017-2018-1 <信息安全系统设计基础>第二周课堂实践+myod 因为在课上已经提交了四个实验,还欠缺最后一个实验,反省一下自己还是操作不熟练,平时在课下应该多多 ...
- flume 安装过程记录
1.安装jdk 2.下载安装包 : apache-flume-1.7.0-bin.tar.gz 安装包是在win下载的,需要拖动到ubuntu下的/home/hadoop (拖动不了需要先安装 lr ...
- 关于nginx反向代理504 gateway time-out配置
问题描述: 使用nginx的默认配置用作后端处理服务的反向代理,针对处理时间超过1分钟的请求,返回504 gateway time-out,但后端服务还在执行中. 原因分析: nginx代理默认超时时 ...
- javaweb(三十一)——国际化(i18n)
一.国际化开发概述 软件的国际化:软件开发时,要使它能同时应对世界不同地区和国家的访问,并针对不同地区和国家的访问,提供相应的.符合来访者阅读习惯的页面或数据. 国际化(internationaliz ...
- shell loop
#!/bin/sh date i=0 while [ $i -le 30 ] do echi $i /usr/sbin/r2/np_test_acl -f rule.txt i=$(e ...
- 学习HTML 第三节.接近正题:HTML样式-CSS级联样式表
CSS (Cascading Style Sheets)级联样式表 内联样式 内联样式- 在HTML元素中使用"style" 属性 使用内联样式的方法是在相关的标签中使用样式属性. ...
- SICP读书笔记 1.2
SICP CONCLUSION 让我们举起杯,祝福那些将他们的思想镶嵌在重重括号之间的Lisp程序员 ! 祝我能够突破层层代码,找到住在里计算机的神灵! 目录 1. 构造过程抽象 2. 构造数据抽象 ...
- 基于marathon-lb的服务自发现与负载均衡
参考文档: Marathon-lb介绍:https://docs.mesosphere.com/1.9/networking/marathon-lb/ 参考:http://www.cnblogs.co ...