JavaScript函数
时间:2019-09-21
本文章向大家介绍JavaScript函数,主要包括JavaScript函数使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
JavaScript函数
一、函数的概念、特性及特点
1.概念
函数是由事件驱动的或者当他被调用时可执行的可重复使用的代码块
2.特性
封装:
将实现某个功能的代码放在一起,类似放在容器中,调用这个容器即可使用这段代码的功能
抽象:
根据某物体的功能或特点抽象出来形成一个名词。俗称起名
函数也可以看做是一种变量,里面的值是一段功能代码
3.特点
选择使用:可以选择需要使用那些功能
重复使用:可以重复调用这个函数
忽略细节:只需要使用函数,不需要了解其内部如何实现的
二、函数的创建
1.声明式创建
function fu(){}
function //声明关键字,指出这是一个函数
fn //函数名,类似于用来存储函数的变量
() //函数需要接受的参数,多个参数用“,”隔开
{} //函数内的执行语句,函数体,函数的功能代码
2.赋值式创建
var fn = function(){}
//这种方式下,虽然这个函数没有名字,但是这个函数赋值给了fn,因此通过变量fn也能调用到这个函数
三、函数的简单分类
1.有名函数
function fn(){};
//声明式创建的函数,正常函数,正常执行,正常使用
2.无名函数
1)可以作为值存在:赋值给一个变量,那么就变成了赋值式创建函数
2)可以作为行为处理函数,又叫事件触发函数
obox.onclick = function(){};
3)可作为实参存在:叫做回调函数
将函数fn2作为参数,传到另一个函数fn1中,在函数fn1中执行函数fn2,那么作为参数的函数fn2就是回调函数
function fn1(cb) { //fn1接收到作为参数的函数fn2
cb(1, 2, 3); //调用fn2来执行
}
function fn2(a, b, c) { //这就是回调函数
console.log(a + b + c); //6
}
fn1(fn2); //将函数fn2传给函数fn1
3.匿名函数
;(function(){})();
//通常会在匿名函数前后都加分号";",防止和上一行的代码连接出现bug
//匿名函数不需要调用立即执行,和没写函数时直接执行代码差不多
//主要用于创建一个大范围的作用域,减少全局变量
四、函数的执行
1.一般函数执行
var fn = function(){};
函数名+();//不能丢掉括号
例:fn();//函数名+小括号就会立即执行函数
2.匿名函数执行
;(function(){})();
//自动直接执行,不需要触发
3.事件触发函数执行
通过各种事件触发并执行函数
1)无名函数:
obox.onclick = function(){};//点击obox后就会触发函数function(){}
2)有名函数
function fn(){};
obox.onclick = fn;//此时fn后不能加小括号,加了就会立即执行---点击obox后就会执行函数fn
document.onclick = fn;//document表示整个页面---点击页面后就会执行函数fn
五、函数的参数
1.参数的概念
指执行函数给传给函数的内容,参数可以为任何值,任何数据
2.参数的分类
实参:执行函数时,函数名后括号内的参数,实参被形参接受并保存
形参:定义函数时,function后括号内的参数,相当于该函数的某个变量,只不过不用var声明,需要遵循变量的命名方式
function fn(a){ //a为形参
console.log(a); //打印出123
}
fn(123); //123为实参
//参数的传递过程如下图
3.参数的一一对应
形参的数量多于实参的数量:多出来的形参是undefined
实参的数量多于形参的数量:多出来的实参被传到函数中的arguments数组对象中
形参相当于变量(可保存任何值),实参相当于赋的值
形参 = 实参;//实参赋值给形参,可传递所有数据
function fn(a,b,c){ //a = 1, b = 2, c = 3---实参的值一一对应传给形参
console.log(a+b+c); //6
}
fn(1,2,3);//执行函数并传值
原文地址:https://www.cnblogs.com/zhupengcheng/p/11562952.html
- Python标准库01 正则表达式 (re包)
- 剑指OFFER之栈的压入、弹出序列(九度OJ1366)
- Python标准库03 路径与文件 (os.path包, glob包)
- AI人工智能时代已经到来 “北斗即时判”实现纯语音交互
- 剑指OFFER之链表中倒数第k个节点(九度OJ1517)
- 用Qt写软件系列四:定制个性化系统托盘菜单
- Linux简介与厂商版本
- 用Qt写软件系列三:一个简单的系统工具之界面美化
- VS编译链接时错误(Error Link2005)的解决方法
- HttpClient使用心得
- 剑指OFFER之重建二叉树(九度OJ1385)
- 记录visual Studio使用过程中的两个问题
- 剑指OFFER之二维数组中的查找(九度OJ1384)
- Python标准库02 时间与日期 (time, datetime包)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 是你们的力量,让知乎看见了!
- 视屏面试传输协议到底是TCP还是UDP
- prometheus学习笔记(1)-mac单机版环境搭建
- Metaspace内存不足导致FGC问题排查
- useful-scripts
- 清空所有 NSUserDefaults 记录
- 重温Java Web的技术细节
- 国密算法SM2加解密_签名验签图形化例子
- 链接脚本linker script的妙用
- 【TBase开源版测评】轻松愉快去O选项:TBase
- Tungsten Fabric知识库丨更多组件内部探秘
- TRTC Android端开发接入学习之环境快速搭建(三)
- 为了满足UI小姐姐要求,自己动手实现了Android面包屑效果(支持Fragment联动)
- Jenkins持续集成「编译打包、代码检查、单元测试、环境部署、软件测试」
- 斗鱼直播带你实现:你主播最爱的Android音视频开发