【JavaScript 4—基础知识点】:函数
导读:函数这个东西,从VB开始就一直在用,不过那时候一般写不出来自己的函数或者类,觉得最高大上的,就是调用API函数了。现在,学习到了JavaScript,总结总结函数,显得很有必要。这篇文章,就从最简单的声明、调用、属性、对象等方面说明。
一、整体说明
二、举例说明
1,静态方法声明+直接调用
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">function Test1() {
alert("测试1");
}//静态方法 Test1();//直接调用</span></span>
2,静态方法声明+在连接中调用
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">function Test1() {
alert("测试1");
}//静态方法
<!--在连接中调用,写在HTML页中-->
<!--<a href="javascript:Test1()">测试1</a>--></span></span>
注意:在连接中调用的文字(这里指测试1),必须存在(可以不是文字)。所谓的连接中使用,就是要有一个东西连接。就比如我们添加超链接一样,不能在空白处添加超链接。
3,事件=“函数”
<!--在事件中调用-->
<!--<input id="Button1" type="button" value="button" onclick="Test1()"/>-->
说明:将2中的在连接中调用,换成在事件中调用
4,动态声明函数
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">//动态方法声明(使用function构造函数)
var Test2 = new Function("strTest","return strTest");
alert(Test2("测试2"));</span></span>
注意:不推荐使用,这种语法会导致两次代码解析(第一次解析常规ECMAScript代码,第二次解析传入构造函数中的字符串),从而影响性能。但我们可以通过这种语法来理解“函数是对象,函数名是指针”的概念
5,直接量声明
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">var Test3=function(strTest3) {
alert(strTest3);
}//直接量方法 Test3("测试3");</span></span>
6,递归调用
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">function Test4(num) {
if (num <= 1) {
return 1;
}
else {
return num * Test4(num - 1);
}
}//递归调用
alert(Test4(4));</span></span>
7.1,函数冒充
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">//函数冒充
function Test5(num1, num2) {
return num1 + num2;
} function Testwu(num1, num2) {//call()和apply()可以冒充另外一个函数
// return Test5.apply(this, [num1, num2]);//apply()冒充,this表示window作用域,[]表示传递的参数
return Test5.call(this, num1, num2);//call()冒充
}
alert(Testwu(1, 2));</span></span>
注意:apply()和call()从整体上看都是一样的,不同的就是对于参数的传递,第一个为作用域,后面的,如果用apply()就是数组,而如果用call(),就直接传递。如果在使用call()的时候使用了数组传参,那么函数的冒充就失败了,比如在本例中,本该打印出结果3,就会出现错误答案:1,2,undefined。
7.2,函数冒充
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">var color = "red";//全局 var box = {
color: "blue"//局部
}; function sayColor() {
alert(this.color);
} //sayColor();全局 //sayColor.call(window);//冒充window红色的
//sayColor.call(this);//this指window
sayColor.call(box);//冒充box,其作用域就在box下,蓝色的</span></span>
注意:使用call()或者apply()来扩充作用域的最大好处,就是对象不需要与方法发生任何耦合关系。也就是说,box对象和sayColor()方法之间不会有多于的关联操作。比如:box.sayColor=sayColor.
8,匿名函数执行
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">//匿名函数,赋值给变量
var Test6=function (){
alert("Lee");
}
Test6(); //通过自我执行来执行匿名函数
(function(){ //(匿名函数)(),第一个圆括号放匿名函数,第二个圆括号执行
alert("Lee");
})();</span></span>
9,闭包
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">//函数里放一个匿名函数
function box() {
return function () {//闭包
return "Lee";
}
}
alert(box()());
</span></span>
10,闭包:局部变量驻留
<span style="font-size:18px;"><span style="font-family:KaiTi_GB2312;font-size:24px;">//使用匿名函数实现局部变量驻留内存中从而累加
function box() {
var age = 100;
return function () {//闭包
age++;
return age;
};
}
var b = box();//让age=100只初始化一次
alert(b());//101
alert(b());//102</span></span>
三、个人感受
觉得函数很简单是吧?今天我做例子的时候(函数的调用方式),出了点问题,然后让一个师姐帮我看看。看了1个多钟,最终也没有看出来。说这些知识真的都很基础,但就是当时没有总结,用的时候就挑自己会的用,结果就是。。。。。。
我只是想重复我学习JavaScript的一个总体的感受,就是,基础真的有够厉害的。指不准哪天,就被一个小问题给拦住了前进的道路。(Angel今天很开心,嘿嘿嘿嘿!)
【JavaScript 4—基础知识点】:函数的更多相关文章
- JavaScript语言基础知识点图示(转)
一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运算符 4.JavaScript 数组 5.Ja ...
- JavaScript语言基础知识点图示
原文:JavaScript语言基础知识点图示 一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运 ...
- JavaScript 语言基础知识点总结
网上找到的一份JavaScript 语言基础知识点总结,还不错,挺全面的. (来自:http://t.cn/zjbXMmi @刘巍峰 分享 )
- 一套最全的JavaScript 语言基础知识点总结(思维导图10张)
1.DOM基础操作 2.数组基础 3.函数基础 4.运算符 5.流程控制语句 6.正则表达式 7.字符串函数 8.数据类型 9.变量 10.window对象
- JavaScript 语言基础知识点总结(思维导图)
JavaScript 数组 JavaScript 函数基础 Javascript 运算符 JavaScript 流程控制 JavaScript 正则表达式 JavaScript 字符串函数 JavaS ...
- 【JavaScript 1—基础知识点】:宏观概述
导读:JavaScript是一门新的(也可以说是旧的或者半新语言),里面有很多的知识点都能和已有的知识产生共鸣.但是,虽然简单,相同点也有很多,也有不同点.我脑袋也不好使,所以对于我来说,还是有必要再 ...
- javascript的基础知识点
一:鼠标提示框 需求描述:鼠标移入都input上,div显示,移出,div消失 分析:控制display=block/none 鼠标移入,鼠标移出事件 <input type="bu ...
- JavaScript相关基础知识点
JavaScript简介: JavaScript是脚本语言,是一种轻量级的编程语言,是可插入 HTML 页面的编程代码,插入 HTML 页面后,可由所有的现代浏览器执行. JavaScript使用: ...
- 【JavaScript 8—基础知识点】:DOM
一.总体概述 1.1,什么是DOM DOM(Document Object Model):D(文档):整个web加载的网页文档:O(对象):类似于window对象之类的东西,可以调用属性和方法,在这里 ...
随机推荐
- 利用自定义消息处理函数的WPARAM或LPARAM参数传递指针
有自定义消息: #define WM_TEST WM_USER+121 消息处理函数: afx_msg void OnTest(WPARAM wParam,LPARAM lParam); 该消息是一个 ...
- spark-wordcount-sample算子测试
import org.apache.spark.{SparkConf, SparkContext} object radomSampleU { def main(args: Array[String] ...
- SQL增删查改语句
一.增:有4种方法 1.使用insert插入单行数据: 语法:insert [into] <表名> [列名] values <列值> insert into sheet1 va ...
- (十三)maven之release和snapshots
发布release 用户A将代码打包到RELEASE仓库.用户B使用时,需要在pom.xml添加jar包的依赖坐标.如果用户A将jar包版本从1.0升级到2.0,用户B使用时也需要在pom.xml中修 ...
- Codeforces Gym 100650B Countdown (离线)
题目链接:http://codeforces.com/gym/100650 根据给出的树和d,求出一些结点,这些结点形成子树的第d层结点数应该尽量多,具体要求可以参考题目. dfs一个结点前保存询问深 ...
- html5文本超过指定行数隐藏显示省略号
这个很简单,直接贴代码就好了 HTML <span class="name">博客园是一个面向开发者的知识分享社区.自创建以来,博客园一直致力并专注于为开发者打造一个纯 ...
- PAT (Basic Level) Practise (中文)-1025. 反转链表 (25)
PAT (Basic Level) Practise (中文)-1025. 反转链表 (25) http://www.patest.cn/contests/pat-b-practise/1025 ...
- Re:从零开始的Linux之路(基础篇)
基于 Red Hat Enterprise Linux 7.5 或者 CentOS 7.4 Linux的命令一定遵循以下格式:command指令 [-options]选项 parameter1参数 ...
- 【php】 php的注释问题,单行注释和多行注释与php结束符的关系
单行注释仅仅注释到行末或者当前的 PHP 代码块,视乎哪个首先出现.这意味着在 // ... ?> 或者 # ... ?> 之后的 HTML 代码将被显示出来:?> 跳出了 PHP ...
- Python解释器镜像源修改
目录 Windows Mac 这篇文章将解除你使用python的pip install xxx受到的网速限制,如果只是下载较小的第三方库,可以尝试pip --default-timeout=100 i ...