JS学习归纳5

        在学习编程的时候,函数是我们用的很多的一个技术。所以本节就对函数的使用,封装,内核进行学习。

一、 函数的概念

        函数:就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。

        简而言之,就是将可以实现某个功能的一块代码,写成一个名字,每次使用这个名字通过填写必要的属性,就可以实现相同逻辑的功能。

二、 函数的使用

        函数在使用时分为两步:声明函数和调用函数。

2.1 声明函数

        注意:function 是声明函数的关键字,必须小写。由于函数一般是为了实现某个功能才定义的, 所以通常我们将函数名命名为动词。

// 声明函数
function 函数名() {
 //函数代码
}

        声明函数本身并不会执行代码,只有调用函数时才会执行函数体代码。

2.2 调用函数

        调用的格式:

// 调用函数
函数名(); // 通过调用函数名来执行函数体代码

2.3  函数的封装

        函数的封装是把一个或者多个功能通过函数的方式封装起来,对外只提供一个简单的函数接口 。

2.4 函数声明调用的案例

        求1-100的累计和:

    <script>
        // 利用函数计算1-100之间的累加和 
        // 1. 声明函数(驼峰命名)
        function getSum() {
            var sum = 0;
            for (let i = 0; i <= 100; i++) {
                sum += i;
            }
            console.log('1-100的和:' + sum);
        }
        // 2. 调用函数
        getSum();
     
    </script>

三、 函数的参数

        如果函数没有参数,那么永远只能调用一种结果,我们的函数缺少灵活性。我们可以利用函数的参数实现函数重复不同的代码。

3.1 形参和实参

        在声明函数时,可以在函数名称后面的小括号中添加一些参数,这些参数被称为形参,而在调用该函数时, 同样也需要传递相应的参数,这些参数被称为实参。

        参数的作用 : 在函数内部某些值不能固定,我们可以通过参数在调用函数时传递不同的值进去。

        在声明函数时,可以在函数名称后面的小括号中添加一些参数,这些参数被称为形参,而在调用该函数时, 同样也需要传递相应的参数,这些参数被称为实参。

// 带参数的函数声明
function 函数名(形参1, 形参2 , 形参3...) { // 可以定义任意多的参数,用逗号分隔
 // 函数体
}
// 带参数的函数调用
函数名(实参1, 实参2, 实参3...); 

        实现一个任意数求和的案例:

    <script>
        function getSum(num1, num2) {
            var sum;
            sum = num1 + num2;
            console.log("和为" + sum);
        }
        getSum(2, 5);
    </script>

3.2 函数参数的传递过程

        1. 调用的时候实参值是传递给形参的

        2. 形参简单理解为:不用声明的变量

        3. 实参和形参的多个参数之间用逗号(,)分隔

3.3 函数形参和实参个数不匹配问题

        1、形参和实参个数相等,输出正确结果

        2、实参个数多于形参,只取到形参的个数

        3、实参个数少于形参,多的形参定义为undefined,结果为NaN

四、 函数的返回值

        有的时候,我们会希望函数将值返回给调用者,此时通过使用 return 语句就可以实现。

        注意:1、在使用 return 语句时,函数会停止执行,并返回指定的值!!!

                   2、如果函数没有 return ,返回的值是 undefined。

                   3、如果函数没有 return ,return 只能返回一个值,如果有多个返回的结果是最后一个值

        比如:

// 声明函数
function getSum(){
 ...
 return 888;
}
// 调用函数
getSum(); // 此时 getSum 的值就等于888,因为 return 语句会把自身后面的值返回给调用者

        求最值的案例:

    <script>
        // 利用函数 求两个数的最大值
        function getMax(num1, num2) {
            return num1 >= num2 ? num1 : num2
        }
        console.log(getMax(5, 9));
    </script>

         求任一数组的最大值案例:

    <script>
        function getArrMax(arr) {
            var max = arr[0];

            for (let i = 0; i < arr.length; i++) {
                if (max <= arr[i]) {
                    max = arr[i];
                }
            }
            return max
        }

        var arr1 = [88, 55, 1, 13, 159, 76]

        console.log(getArrMax(arr1));
    </script>

五、 arguments的使用

        当我们不确定有多少个参数传递的时候,可以用 arguments 来获取。在 JavaScript 中,arguments 实际上 它是当前函数的一个内置对象。所有函数都内置了一个 arguments 对象,arguments 对象中存储了传递的 所有实参

        只有函数才有 arguments对象  而且是每个函数都内置好了这个arguments

        arguments展示形式是一个伪数组,因此可以进行遍历。伪数组具有以下特点:

        1、 具有 length 属性

        2、 按索引方式储存数据

        借助arguments可以实现任意个数参数的求和:

    <script>
        // arguments 的使用  只有函数才有 arguments对象  而且是每个函数都内置好了这个arguments
        function Sum() {
            console.log(arguments);
            console.log(arguments.length);
            console.log(arguments[1])
            var sum = 0;
            for (let i = 0; i < arguments.length; i++) {
                sum += arguments[i];

            }
            console.log("任意长度求和:" + sum);
        }

        Sum(1, 2, 3, 4, 5, 6, 7, 8, 9);
    </script>

六、 函数的两种声明方式

6.1 自定义函数方式(命名函数)

        因为有名字,所以也被称为命名函数。调用函数的代码既可以放到声明函数的前面,也可以放在声明函数的后面。

// 声明定义方式
function fn() {...}
// 调用 
fn();

6.2 函数表达式方式(匿名函数)

        因为函数没有名字,所以也被称为匿名函数。

        1、 这个fn 里面存储的是一个函数

        2、 函数表达式方式原理跟声明变量方式是一致的

        3、 函数调用的代码必须写到函数体后面

// 这是函数表达式写法,匿名函数后面跟分号结束
var fn = function(){...};
// 调用的方式,函数调用必须写到函数体下面
fn();

七、 函数的案例

7.1 利用函数封装方式,翻转任意一个数组:

    <script>
        // 利用函数翻转任意数组 reverse 翻转
        function reverse(arr) {
            var newarr = [];
            for (let i = arr.length - 1; i >= 0; i--) {
                newarr[newarr.length] = arr[i];
            }
            return newarr
        }
        var arr1 = reverse([1, 2, 3, 4, 5, 6]);
        console.log(arr1);
        var arr2 = reverse(['你', '好', '啊']);
        console.log(arr2);
    </script>

7.2 利用函数封装方式,对数组排序 -- 冒泡排序

    <script>
        // 利用函数冒泡排序 sort 排序
        function sort(arr) {
            var temp;
            for (let i = 0; i < arr.length - 1; i++) {
                for (let j = 0; j < arr.length - i - 1; j++) {
                    if (arr[j] >= arr[j + 1]) {
                        temp = arr[j];
                        arr[j] = arr[j + 1];
                        arr[j + 1] = temp;
                    }

                }

            }
            return arr
        }
        var arr1 = sort([12, 2, 55, 32, 1, 25, 88]);
        console.log(arr1);

    </script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/553686.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

退市危机袭来,环保行业能否逆境崛起?|中联环保圈

近年来&#xff0c;环保行业风波持续不断&#xff0c;众多环保大公司风险频出。博天环境的退市危机令人感慨&#xff0c;深圳星源因涉嫌信息披露违法违规而被警告退市&#xff0c;更是引发业界震动。 最近三年&#xff0c;证监会办理的上市公司信息披露违法案件多达 397 件&…

Linux内核之virt_to_page实现与用法实例(五十)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

Python 使用 pip 安装 matplotlib 模块(精华版)

pip 安装 matplotlib 模块 1.使用pip安装matplotlib(五步实现):2.使用下载的matplotlib画图: 1.使用pip安装matplotlib(五步实现): 长话短说&#xff1a;本人下载 matplotlib 花了大概三个半小时屡屡碰壁&#xff0c;险些暴走。为了不让新来的小伙伴走我的弯路&#xff0c;特意…

IPAguard--iOS代码混淆工具(免费)

IPAguard是一款为iOS开发者设计的代码混淆工具&#xff0c;旨在为开发者提供方便制作和分析马甲包的解决方案。通过高效的匹配算法&#xff0c;IPAguard可以在保证代码混淆的同时&#xff0c;保证编译后的代码质量&#xff0c;减少了因混淆引起的bug&#xff0c;使得开发者能够…

写后端项目的分页查询时,解决分页不更新

写基于VueSpringBoot项目&#xff0c;实现分页查询功能时&#xff0c;改完代码后&#xff0c;发现页数不更新&#xff1a; 更改处如下&#xff1a; 显示如图&#xff1a; 发现页数没有变化&#xff0c;两条数据还是显示在同一页&#xff0c;而且每页都10条。且重启项目也没有更…

代码随想录算法训练营第一天 | 704. 二分查找 | 27. 移除元素

704. 二分查找 int search(int* nums, int numsSize, int target) {int left 0, right numsSize, mid;while (left < right) {mid left (right -left) / 2;if (nums[mid] < target) {left mid 1;} else if (nums[mid] > target) {right mid;} else {return mid…

民兵档案管理系统-退伍军人档案管理全流程追踪

民兵档案管理系统&#xff08;智档案DW-S403&#xff09;是依托互3D技术、云计算、大数据、RFID技术、数据库技术、AI、视频分析技术对RFID智能仓库进行统一管理、分析的信息化、智能化、规范化的系统。 RFID档案管理系统是以先进的RFID技术为基础&#xff0c;结合数据库技术、…

压缩感知的概述梳理(1)

参考文献 An efficient visually meaningful image compression and encryption scheme based on compressive sensing and dynamic LSB embedding 基本内容 基本关系梳理 压缩感知核心元素 信号 x 长度&#xff1a;N动态稀疏或可用变换表示&#xff1a;x &#x1d74d;s …

AI实践与学习4_大模型之检索增强生成RAG实践

背景 针对AI解题业务场景&#xff0c;靠着ToT、CoT等提示词规则去引导模型的输出答案&#xff0c;一定程度相比Zero-shot解答质量更高&#xff08;正确率、格式&#xff09;等。但是针对某些测试CASE&#xff0c;LLM仍然不能输出期望的正确结果&#xff0c;将AI解题应用生产仍…

「不羁联盟/XDefiant」4月20号开启服务器测试,游戏预下载安装教程

XDefiant》开启Alpha测试&#xff0c;这是一款免费游玩的快节奏 FPS 竞技游戏&#xff0c;可选择特色阵营&#xff0c;搭配个性化的装备&#xff0c;体验 6v6 对抗或是线性游戏模式。高品质射击竞技端游XDefiant以6v6双边对抗为核心&#xff0c;对局模式分为区域与线性两大类&a…

LeetCode108:讲有序数组转换为平衡二叉搜索树

题目描述 给你一个整数数组 nums &#xff0c;其中元素已经按 升序 排列&#xff0c;请你将其转换为一棵 平衡二叉搜索树。 代码 class Solution { public:TreeNode* traversal(vector<int>& nums, int left, int right) {if (left > right) return nullptr;int …

单片机学习笔记——LED点阵

代码如下&#xff0c;注意管脚和扫描所用的hc595_write_data函数 #include "reg51.h"typedef unsigned int u16; //对系统默认数据类型进行重定义 typedef unsigned char u8;//定义74HC595控制管脚 sbit SRCLKP3^6; //移位寄存器时钟输入 sbit RCLKP3^5; //存储寄存…

Java | Leetcode Java题解之第36题有效的数独

题目&#xff1a; 题解&#xff1a; class Solution {public boolean isValidSudoku(char[][] board) {int[][] rows new int[9][9];int[][] columns new int[9][9];int[][][] subboxes new int[3][3][9];for (int i 0; i < 9; i) {for (int j 0; j < 9; j) {char …

内网代理技术总结

代理技术就是解决外网和内网的通信问题&#xff0c;例如&#xff0c;我的一个外网主机想要找到另外一个网段下的一个内网主机&#xff0c;理论上是无法找到的。如果我们想要进行通信的话就要使用代理技术。我们可以找到一个与目标内网主机在容易网段下可以通信的外网主机&#…

Android 12 如何加载 native 原生库

在 Android 7.0 及更高版本中&#xff0c;系统库与应用库是分开的。 图1. 原生库的命名空间 原生库的命名空间可防止应用使用私有平台的原生 API&#xff08;例如使用 OpenSSL&#xff09;。该命名空间还可以避免应用意外使用平台库&#xff08;而非它们自己的库&#xff09;的…

LangChain入门:22.使用 arXiv 工具开发科研助理

有一些工具&#xff0c;比如 SerpAPI&#xff0c;你已经用过了&#xff0c;这里我们再来用一下 arXiv 工具。arXiv 本身就是一个论文研究的利器&#xff0c;里面的论文数量比 AI 顶会还早、还多、还全。那么把它以工具的形式集成到 LangChain 中&#xff0c;能让你在研究学术最…

高精度PWM脉宽调制信号转模拟信号隔离变送器1Hz-10KHz转0-5V/0-10V/1-5V,0-10mA/0-20mA/4-20mA

主要特性: >>精度等级&#xff1a;0.1级。产品出厂前已检验校正&#xff0c;用户可以直接使用 >>辅助电源&#xff1a;8-32V 宽范围供电 >>PWM脉宽调制信号输入: 1Hz~10KHz >>输出标准信号&#xff1a;0-5V/0-10V/1-5V,0-10mA/0-20mA/4-20mA等&…

动手写sql 《牛客网80道sql》

第1章&#xff1a;SQL编写基础逻辑和常见问题 基础逻辑 SELECT语句: 选择数据表中的列。FROM语句: 指定查询将要从哪个表中检索数据。WHERE语句: 过滤条件&#xff0c;用于提取满足特定条件的记录。GROUP BY语句: 对结果进行分组。HAVING语句: 对分组后的结果进行条件过滤。O…

根据 Figma 设计稿自动生成 Python GUI | 开源日报 No.221

ParthJadhav/Tkinter-Designer Stars: 8.0k License: BSD-3-Clause Tkinter-Designer 是一个用于快速创建 Python GUI 的工具&#xff0c;通过使用 Figma 设计软件&#xff0c;可以轻松地生成美观的 Tkinter GUI。 主要功能和优势包括&#xff1a; 拖放界面设计比手写代码更快…

Computer Organization/Architecture 计算机组织/架构/结构 重要观念和笔记(陆续更新中,2024/04/17周三,已更新)

前情提要&#xff1a;我的说法比较白话&#xff0c;希望可以更好理解其中一些观念&#xff0c;这篇会以中文为主&#xff0c;专有名词还是用英文&#xff0c;好吧应该会中英穿插&#xff0c;自己学的时候感觉听中文会吸收比较快&#xff0c;也可能是我英文比较烂的关系&#xf…
最新文章