第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 ...
随机推荐
- 20155206 2016-2017-2 《Java程序设计》第三周学习总结
20155206 2016-2017-2 <Java程序设计>第三周学习总结 教材学习内容总结 两个基本标准类:java.util.Scanner , java.math.BigDecim ...
- day1 post验证登录
用post方式模拟 1.登录抽屉网 2.登录代码 ,URL,Form Data 中的信息写入 # coding=utf-8 #post 登录验证 import requests form_data = ...
- Intellif IDEA 自带数据库管理工具 DataBase 配置
第一步: 第二步: 第三步: jdbc:oracle:thin:@192.168.19.39:1521:orcl
- Vue.js之常用指令
vue常用指令 vue.js官方给自己的定义是数据模板引擎,并给出了一套渲染数据的指令.本文详细介绍vue.js的常用指令. 官网:点我 一.v-text.v-html v-text:用于绑定文本 v ...
- KEIL5的安装
安装注意事项 1.最好不要安装在带有中文路径的文件夹. 2.试用版的Keil MDK只能编译32K以下的代码,代码大于32K只能使用正版或破解版才能编译通过. 安装MKD 这里选择MKD512A版本安 ...
- leetcode26_C++删除排序数组中的重复项
给定一个排序数组,你需要在原地删除重复出现的元素,使得每个元素只出现一次,返回移除后数组的新长度. 不要使用额外的数组空间,你必须在原地修改输入数组并在使用 O(1) 额外空间的条件下完成. 示例 1 ...
- Method 'ExecuteAsync' in type 'System.Data.Entity.SqlServer.DefaultSqlExecutionStrategy' does not have an implementation
一.错误信息 Entity Framework 6.0数据迁移:Add-Migration XXXX 命令发生错误 System.Reflection.TargetInvocationExceptio ...
- CentOS 6.7下创建桌面快捷方式
CentOS 6.7下创建桌面快捷方式如下: 1 在桌面右键,选择“创建启动器" 2 在弹出菜单中,填写名称(显示在桌面上的名字),命令(可执行程序的路径) 3 点击弹出菜单左边的图标,选择 ...
- 通过Nrgok映射外网调试微信
一.注册账号 注册地址:http://www.ngrok.cc/login 登录系统,新增域名 二.下载客户端,修改配置文件 修改ngrok.cfg auth_token值登录平台管理系统可查看 su ...
- Requests库入门——应用实例-网络图片的爬取与保存(好看的小姐姐≧▽≦)
在B站学习这一节的时候,弹幕最为激烈,不管大家是出于什么目的都想体验一下网络爬虫爬取图片的魅力,毕竟之前的实例实话说都是一些没有太大作用的信息. 好了,直接上代码: import requests i ...