我的js学习(函数)

学习js第三天

函数

函数是JS中的引用类型数据之一。
我们之前学习变量的时候 说变量的作用是复用数据。
函数就是一个工具,可以将代码放在里面,随时执行。
注: 函数是一等公民

函数的组成部分

function关键字函数名() 形参列表{} 函数体

函数的定义

函数的定义方式: 函数声明函数表达式构造函数
函数声明function fun() {}
函数表达式var fun = function() {}
构造函数(了解): var fun = new Function()

var fun = function() {
            console.log("我是函数表达式");
        } 
        function fun1() {
            console.log("我是函数声明");
        }
        
   fun1();
   fun();

js中函数和变量的提升

    JS声明提升
    指的是浏览器的解析引擎在执行JS代码的时候会把所有的变量和函数声明的函数提升到代码的最开头
变量的提升
        console.log(a);// 可以用 但是没有值
        var a = 10;
        console.log(a); // 正常用 推荐
函数声明的提升  
        fun();
        function fun() {
            console.log(11)
        }
        fun();
函数表达式的提升 本质并没有提升函数 提升的是变量
        console.log(fun); // undefined
        fun(); // 报错: fun 不是一个函数
        var fun = function() {
            console.log(22);
        }
        fun();

我们现在已经知道的函数的知识有:
1 函数的定义
2 函数的调用
函数定义完毕之后,就可以任意次调用
函数声明定义的函数可以在任何地方去调用
函数表达式定义的函数只能在定义之后去调用

预解析

  • JS引擎执行代码的阶段:

    • 通读代码

      在通读代码阶段,引擎会先查看是否有语法错误,如果有,就报错。如果没有,则在这个过程中,就会将代码中所有的通过var声明的变量和通过function声明的函数提升到代码的最前面。这个提升行为,就是发生在预解析阶段。

    • 执行代码

      将代码按照规则,一条一条执行。

函数的参数

形参列表中,可以放置 形式参数 。简称: 形参。形参是函数内的变量 只能够在函数内部使用
当函数执行的时候,可以往圆括号内填写数据,这种行为,叫做 传参, 用于函数运行中使用,这样的参数叫做 实际参数,简称 实参

函数参数的关系

一个函数的形参和实参有一一对应的关系。

  • 当形参比实参多: 多余的形参的值为undefined
function sum(a, b) {
    console.log(a);
    console.log(b); 
}
sum(10); // a是10 b是undefined
  • 当形参比实参少: 没有形参接收多余的实参
function sum(a, b) {
    console.log(a);
    console.log(b);
}
sum(10, 11, 12); // a是10 b是11 12没有形参来接收

return关键字

作用: 该关键字是用于在函数内部 返回内容中止函数执行 的。

// 中止函数执行
function demo() {
    console.log(1);
    console.log(2);
    console.log(3);
    return;
    console.log(4);
    console.log(5);
}
demo(); // 只会输出1 2 3 而不会输出4 5 因为遇见了return
// 返回内容
var a = 10;
var b = 11;
function sum(num1, num2) {
    return num1 + num2;
}
// 进行计算
var result = sum(a, b);
// 使用结果
console.log(result); // 21

注: return关键字只能够在函数内部出现。

作用域

  • 作用域: 规定变量起作用的范围
  • 划分规则: 只有全局作用域和函数的私有作用域
  • 作用域是根据书写的单词和语法来确定的,所以又叫做词法作用域.
  • 所以,通常我们把代码写完,就可以确定每一个作用域的范围.

注: script标签之间是全局作用域 多个script标签共享同一个作用域 但是每一个script标签中的变量 函数,它们的提升,只能够在本script标签的范围之内.

注: 浏览器在加载script标签的代码的时候,是一个script标签加载并执行完毕之后,再去加载执行后面的一个.

    <script>
        var a = 10;
    </script>
    <script>
        console.log(a); // 输出10
    </script>


    <script>
        console.log(a); // ReferenceError: a is not defined
    </script>
    <script>
        var a = 10;
    </script>

递归函数(重要、了解)

递归函数指的是函数自己再函数体内部调用自己.

注: 无停止条件的递归 就是死循环 写递归函数,先写停止条件

// a变量一定要定义在函数外部 
var a = 0;
function demo() {
    a++;
    if (a >= 10) {
        return;
    }
    demo();
}
demo(); // 循环让a自加10次 之后就停止

作用域的机制

作用域是变量的生效的范围。
变量操作又分为使用变量赋值变量

  • 使用变量
    • 出现在表达式中,赋值语句右侧。
    • 访问变量规则
      • 当访问变量的时候,会先查看当前作用域中是否存在该变量
      • 如果有,就使用,并终止查找。
      • 如果没有,就将会向上一层级作用域中寻找。
      • 依次向上,直到找到,或者到了全局作用域中还没有找到,就会报错。
  • 赋值变量
    • 只出现在赋值语句左侧
    • 赋值变量规则
      • 当对一个变量进行赋值的时候,会先查看当前作用域中是否存在该变量
      • 如果有,就赋值。
      • 如果没有,就向上一层级查找。
      • 依次向上,直到找到,或者到了全局作用域中还没有找到
      • 就会在全局作用域中悄悄的声明这个变量并赋值
// 当前是全局作用域
var num = 100; // 在全局作用域中定义的变量

// 定义一个函数
function demo() {
    var num = 101; // 这是在函数作用域中定义的变量
    console.log(num);
}
// 执行函数
demo(); // 101 

解释: 当在函数内部访问变量num的时候,先看当前作用域中是否有num 找到了! 于是就用101 输出101

var num = 100; // 在全局作用域中定义的变量
// 定义一个函数
function demo() {
    // var num;  // 因为声明提升的原因 代码其实是这样子的
    console.log(num); 
    var num = 101; // 这是在函数作用域中定义的变量 虽然定义是在这里 但是提升了
}
// 执行函数
demo(); // undefined

解释: 依旧是作用域的问题,但是因为输出代码在前面,所以有些同学可能会误以为会输出100 但是不要忘记变量的查找规则与预解析!!!

var num = 100; // 在全局作用域中定义的变量
// 定义一个函数
function demo() {
    var num = 101; 
}
// 执行函数
demo();
// num是多少
console.log(num); // 100

解释: 作用域的问题,因为输出的代码是在全局作用域中的,所以会直接访问全局中的变量 而与函数内部的变量无关

var num = 100; // 在全局作用域中定义的变量
// 定义一个函数
function demo() {
    num = 101; 
}
console.log(num); // 100
// 执行函数
demo();
// num是多少
console.log(num); // 101   
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: JavaScript 函数是一组语句的集合,它可以被命名并可以被执行多次。函数可以接受参数并返回结果。函数可以在脚本中的任何地方定义,但通常在脚本的开头定义,然后在脚本的其他地方调用。 语法: ``` function functionName(parameters) { // code to be executed } ``` 示例: ``` function sayHello(name) { console.log("Hello, " + name); } sayHello("John"); // Output: "Hello, John" ``` JavaScript 中还有一种类型为 "箭头函数"(Arrow function),其语法与传统函数略有不同。 示例: ``` let sayHello = (name) => { console.log("Hello, " + name); } sayHello("John"); // Output: "Hello, John" ``` ### 回答2: JavaScript函数,可以看做是一种带有特定功能的代码片段。它可以接受参数,以及返回值。函数JavaScript的重要组成部分之一,它被用于简化代码,实现模块化,以及使代码更易于维护和调试。 函数的定义:使用关键字“function”和函数名来定义函数函数名是可选的。参数的定义在圆括号内,多个参数使用逗号隔开。函数语句以花括号“{}”来包含。一个函数可以有多个语句。返回值通过“return”语句来实现。 函数的调用:可以通过函数名加上参数列表的形式来调用函数。注意要使用函数名后的小括号“()”,以及实际参数列表。 函数的参数:JavaScript每个函数都可以有零个或多个参数。每个参数由参数名和类型组成。参数的类型是不需要显式声明的。在函数内部可以使用参数名来访问参数的值。如果函数需要返回多个值,可以使用对象或数组。 函数的返回值:函数的返回值可以是任意类型的值。返回值可以直接指定值,或者通过表达式计算得出。如果在函数中没有使用“return”语句,则函数默认返回“undefined”。如果没有显式的返回值,则函数执行到最后一行代码后结束。 函数作为一个值:JavaScript中的函数可以作为一个值被传递给其他函数函数作为值的特别之处在于,函数可以被存储为变量或对象的属性,或者被其他函数返回。这使得函数可以方便的用于实现回调函数和模块化编程。 闭包:JavaScript函数的一个特别之处是,函数内部可以定义其他函数。定义在函数内部的函数可以访问外部函数的所有变量和参数,这就是闭包。闭包使得函数可以“记住”调用它时的上下文环境,这使得函数可以在不同的场合下具有不同的行为。 函数的实际应用非常广泛,无论是前端还是后端开发都离不开它。因此,学会灵活、熟练的掌握JavaScript函数,对于从事Web开发的初学者或者有一定开发基础的程序员来说都非常重要。 ### 回答3: JavaScript 函数是一种可重复使用的代码块,由定义、参数列表和函数体组成,可以对于函数内部逻辑的实现进行封装,从而实现代码的可维护性、可读性和可扩展性。函数JavaScript 的核心机制之一,系统中有很多内置函数和用户自定义函数函数的定义: 函数可以通过函数关键字 function 来定义,格式为: ``` function 函数名(参数1, 参数2...) { // 函数体 } ``` 其中,参数可以是任意类型,也可以不定义参数。函数体中可以包括任意合法的 JavaScript 代码,包括变量声明、表达式、语句等。函数名可以是任意合法的标识符,命名规则与变量命名规则相同。 函数的调用: 函数调用时,需要在函数名后面加上一对圆括号,括号中可以包含函数参数的值或表达式。例如: ``` function foo(a, b) { return a + b; } foo(2, 3); // 5 ``` 函数的参数传递: JavaScript 函数中的参数传递可以通过值传递和引用传递两种方式。 值传递是指函数调用时,实参的值会被复制到函数的形参中,在函数内部对形参的修改不会影响到实参的值。例如: ``` function swap(x, y) { let temp = x; x = y; y = temp; } let a = 1, b = 2; swap(a, b); console.log(a, b); // 1, 2 ``` 引用传递是指函数调用时,实参是一个对象或数组,函数内部对形参的修改会影响到实参的值。例如: ``` function change(obj) { obj.name = 'Tom'; obj.age = 18; } let person = { name: 'Jerry', age: 20 }; change(person); console.log(person); // {name: 'Tom', age: 18} ``` 函数的返回值: 函数可以通过 return 语句返回一个值,如果没有 return 语句,将返回 undefined。例如: ``` function sum(a, b) { return a + b; } let s = sum(1, 2); console.log(s); // 3 ``` 函数还可以返回一个函数,形成函数嵌套,实现程序逻辑的分离和复用。例如: ``` function makeAdder(a) { return function(b) { return a + b; }; } let add5 = makeAdder(5); console.log(add5(2)); // 7 console.log(add5(3)); // 8 ``` JavaScript 函数的特点包括可重复使用、可维护性高、参数传递灵活等,可以帮助我们实现复杂的程序设计。在学习和使用 JavaScript 函数的过程中,需要注意函数的命名规范、参数传递的方式、返回值类型的确定等问题,同时也需要注意函数的作用域、闭包、高阶函数等更深入的话题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值