JavaScript函数

JavaScript函数

1、函数定义

  • 用来封装你的重复性代码
  • 在python定义函数须要用到关键字def
  • 在 js 中使用 function 定义函数

语法:python

// 语法 
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填补)

2、函数参数

  • 参数通常五个如下
  • 函数内引用的参数大于传入的参数会以 “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);     // 正常执行

3、函数的返回值与表达式

函数返回值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

4、匿名函数

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

5、箭头函数

  • 箭头函数: 主要用来处理简单的业务逻辑 相似于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`

6、小结

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

7、函数全局变量与局部变量

1.介绍

局部变量:markdown

  • 在JavaScript函数内部声明的变量(使用 var)是局部变量,因此只能在函数内部访问它(该变量的做用域是函数内部)。只要函数运行完毕,本地变量就会被删除。

全局变量:闭包

  • 在函数外声明的变量是全局变量,网页上的全部脚本和函数都能访问它。

变量生存周期:ide

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

做用域函数

  • 首先在函数内部查找变量,找不到则到外层函数查找,逐步找到最外层。与python做用域关系查找如出一辙

2.示例

跟python查找变量的顺序一致atom

  • 示例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
相关文章
相关标签/搜索