导读:函数这个东西,从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—基础知识点】:函数的更多相关文章

  1. JavaScript语言基础知识点图示(转)

    一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运算符 4.JavaScript 数组 5.Ja ...

  2. JavaScript语言基础知识点图示

    原文:JavaScript语言基础知识点图示 一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运 ...

  3. JavaScript 语言基础知识点总结

    网上找到的一份JavaScript 语言基础知识点总结,还不错,挺全面的. (来自:http://t.cn/zjbXMmi @刘巍峰 分享 )  

  4. 一套最全的JavaScript 语言基础知识点总结(思维导图10张)

    1.DOM基础操作 2.数组基础 3.函数基础 4.运算符 5.流程控制语句 6.正则表达式 7.字符串函数 8.数据类型 9.变量 10.window对象

  5. JavaScript 语言基础知识点总结(思维导图)

    JavaScript 数组 JavaScript 函数基础 Javascript 运算符 JavaScript 流程控制 JavaScript 正则表达式 JavaScript 字符串函数 JavaS ...

  6. 【JavaScript 1—基础知识点】:宏观概述

    导读:JavaScript是一门新的(也可以说是旧的或者半新语言),里面有很多的知识点都能和已有的知识产生共鸣.但是,虽然简单,相同点也有很多,也有不同点.我脑袋也不好使,所以对于我来说,还是有必要再 ...

  7. javascript的基础知识点

    一:鼠标提示框 需求描述:鼠标移入都input上,div显示,移出,div消失 分析:控制display=block/none 鼠标移入,鼠标移出事件  <input type="bu ...

  8. JavaScript相关基础知识点

    JavaScript简介: JavaScript是脚本语言,是一种轻量级的编程语言,是可插入 HTML 页面的编程代码,插入 HTML 页面后,可由所有的现代浏览器执行. JavaScript使用: ...

  9. 【JavaScript 8—基础知识点】:DOM

    一.总体概述 1.1,什么是DOM DOM(Document Object Model):D(文档):整个web加载的网页文档:O(对象):类似于window对象之类的东西,可以调用属性和方法,在这里 ...

随机推荐

  1. 利用自定义消息处理函数的WPARAM或LPARAM参数传递指针

    有自定义消息: #define WM_TEST WM_USER+121 消息处理函数: afx_msg void OnTest(WPARAM wParam,LPARAM lParam); 该消息是一个 ...

  2. spark-wordcount-sample算子测试

    import org.apache.spark.{SparkConf, SparkContext} object radomSampleU { def main(args: Array[String] ...

  3. SQL增删查改语句

    一.增:有4种方法 1.使用insert插入单行数据: 语法:insert [into] <表名> [列名] values <列值> insert into sheet1 va ...

  4. (十三)maven之release和snapshots

    发布release 用户A将代码打包到RELEASE仓库.用户B使用时,需要在pom.xml添加jar包的依赖坐标.如果用户A将jar包版本从1.0升级到2.0,用户B使用时也需要在pom.xml中修 ...

  5. Codeforces Gym 100650B Countdown (离线)

    题目链接:http://codeforces.com/gym/100650 根据给出的树和d,求出一些结点,这些结点形成子树的第d层结点数应该尽量多,具体要求可以参考题目. dfs一个结点前保存询问深 ...

  6. html5文本超过指定行数隐藏显示省略号

    这个很简单,直接贴代码就好了 HTML <span class="name">博客园是一个面向开发者的知识分享社区.自创建以来,博客园一直致力并专注于为开发者打造一个纯 ...

  7. PAT (Basic Level) Practise (中文)-1025. 反转链表 (25)

    PAT (Basic Level) Practise (中文)-1025. 反转链表 (25)   http://www.patest.cn/contests/pat-b-practise/1025 ...

  8. Re:从零开始的Linux之路(基础篇)

    基于 Red Hat Enterprise Linux 7.5 或者 CentOS 7.4 Linux的命令一定遵循以下格式:command指令  [-options]选项  parameter1参数 ...

  9. 【php】 php的注释问题,单行注释和多行注释与php结束符的关系

    单行注释仅仅注释到行末或者当前的 PHP 代码块,视乎哪个首先出现.这意味着在 // ... ?> 或者 # ... ?> 之后的 HTML 代码将被显示出来:?> 跳出了 PHP ...

  10. Python解释器镜像源修改

    目录 Windows Mac 这篇文章将解除你使用python的pip install xxx受到的网速限制,如果只是下载较小的第三方库,可以尝试pip --default-timeout=100 i ...