JavaScript函数

JavaScript函数
文章目录
JavaScript函数
一、函数定义
二、函数参数
三、函数的返回值与表达式
函数返回值return
函数表达式
四、匿名函数
五、箭头函数
六、小结
七、函数全局变量与局部变量
1.介绍
2.示例
一、函数定义
用来封装你的重复性代码
在python定义函数需要用到关键字def
在 js 中使用 function 定义函数
语法：

// 语法
function [函数名](形参1,形参2,形参3…){
[函数体代码];
}

// 无参函数
function func1() {
console.log(‘hello world’);
}
func1(); // hello world

// 有参函数
function func2(a, b) {
console.log(a, b);
}
func2(1, 2); // 1 2
func2(1, 2, 3, 4, 5, 6, 7, 8, 9); // 1 2(多了没关系 只要对应的数据)
func2(1); // 1 undefined(少了也没关系, 未定义的会用undefined填补)

二、函数参数
参数一般五个以下
函数内引用的参数大于传入的参数会以 “undefined” 替代
函数内引用的参数小于传入的参数, 那么只会取出相应的参数
function cook(isBad,a,b,c){ // isbad形式参数
if (isBad){
alert(‘做饭’);

}else{
alert(‘点一个外卖’);
}
}
var bad = false; //刀坏了
cook(bad); // 点一个外卖

arguments 参数
函数中的arguments参数: 能够获取到函数接受到的所有的参数

function func3(a, b, c) {
console.log(arguments);
}
func3(1, 2, 3);
// 执行结果:
/*
Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
0: 1
1: 2
2: 3
*/

// 使用arguments判断传参的确切性
function func4(a, b) {
if (arguments.length < 2) {
console.log(‘参数传少了!’);
} else if (arguments.length > 2) {
console.log(‘参数传多了!’);
} else {
console.log(‘正常执行’);
}
}
func4(1, 2, 3); // 参数传多了!
func4(1); // 参数传少了!
func4(1, 2); // 正常执行

三、函数的返回值与表达式
函数返回值return
函数的返回值: 使用的也是等同于python中的关键字return
function func5() { // 返回一个值
return 666
}
console.log(func5()); // 666

function func6(a, b) { // 返回多个值, 多个值必须被包含不然就会返回逗号前面的那一个值.
return a, b
}
console.log(func6(1, 2)); // 2

function func7(a, b) {
return [a, b]
}
console.log(func7(1, 2)); // [1, 2]

函数表达式
var division = function(a,b){
return a/b;
}
// 调用
division(10,2) // 5

四、匿名函数
没有名字的函数
函数可以被赋值, 但对于一个匿名函数来说赋予名字没有意义
匿名函数一般与 map( ) 之类的函数组合使用
/*function () {
console.log(‘哈哈哈’);
}*/
let res = function() { // 函数还可以被赋值, 对于匿名函数这也赋值虽然没有什么意义, 但是为了然函数能正常执行, 还是赋值一个变量吧~
console.log(‘哈哈哈’);
};
res(); // 哈哈哈

五、箭头函数
箭头函数: 主要用来处理简单的业务逻辑 类似于python中的匿名函
ES6中允许使用“箭头”（=>）定义函数
// 如果箭头函数不需要参数或需要多个参数，就是用圆括号代表参数部分
var f = () => 5;

// 等同于
var f = function(){return 5};

let func8 = v => v*2; // 箭头左边的是形参 右边的是返回值
console.log(func8(2)); // 4

let func9 = function (v) { // 上面与下面作用等同
return v * 2;
};
console.log(func9(2)); // 4`

六、小结
/*
函数定义: 无参, 有参
函数调用: 无参直接调用. 有参调用传值多余部分不要, 少的部分用undefined提补.
arguments: 可以接受所有参数, 可以通过arguments.length获取传入的参数个数.
函数返回值: 单个返回值. 多个返回值需被包含, 如果不包含只返回逗号前面一个值.
匿名函数: 匿名函数可被赋值.
箭头函数:
无参: let a = () => 返回值;
有参: let a = 形参 => 返回值;
*/

七、函数全局变量与局部变量
1.介绍
局部变量：

在JavaScript函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它（该变量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除。
全局变量：

在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
变量生存周期：

JavaScript变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。
作用域

首先在函数内部查找变量，找不到则到外层函数查找，逐步找到*外层。与python作用域关系查找一模一样
2.示例
跟python查找变量的顺序一致

示例1
var city = “BeiJing”;
function f() {
var city = “ShangHai”;
function inner(){
var city = “ShenZhen”;
console.log(city);
}
inner();
}
f(); // 输出结果是？ ShenZhen

// ES6推荐使用let
let city = “BeiJing”;
function f() {
let city = “ShangHai”;
function inner(){
let city = “ShenZhen”;
console.log(city);
}
inner();
}
f(); // 输出结果是？ ShenZhen

示例2
var city = “BeiJing”;
function Bar() {
console.log(city);
}
function f() {
var city = “ShangHai”;
return Bar;
}
var ret = f();
ret(); // 打印结果是？ BeiJing

// ES6推荐使用let
let city = “BeiJing”;
function Bar() {
console.log(city);
}
function f() {
let city = “ShangHai”;
return Bar;
}
let ret = f();
ret(); // 打印结果是？ BeiJing

示例3：闭包函数
var city = “BeiJing”;
function f(){
var city = “ShangHai”;
function inner(){
console.log(city);
}
return inner;
}
var ret = f();
ret(); // ShangHai

// ES6推荐使用let
let city = “BeiJing”;
function f(){
let city = “ShangHai”;
function inner(){
console.log(city);
}
return inner;
}
let ret = f();
ret(); // ShangHai