04-JavaScript函数

函数(重点)

1.为什么使用函数?

函数来解决代码重用的问题

2.函数的意义

函数其实就是封装,把可以重复使用的代码放到函数中,如果需要多次使用同一段代码,就可以把封装成一个函数。这样的话,在你需要再次写这些代码的时候,你只需要调用一次函数就行了。

3.定义函数的方式

3.1 使用字面量的形式定义函数

ECMAScript中的函数使用function关键字来声明,后面跟一组参数及函数体。函数的基本语法如下:

3.1.1 定义函数

 function sum(num1, num2) {var num3 = num1 + num2;console.log(num3);}

3.1.2 函数的调用

这个函数的作用是把两个值加起来返回一个结果。函数必须通过调用才会执行,调用这个函数的代码如下:

sum(5, 10); //15

3.1.3 函数的参数

  • 函数的参数分为实际参数(实参)和形式参数(形参);

  • 函数可以传递1个、3个甚至不传递参数,根据实际代码的需求传递。

3.2 使用函数表达式声明函数(匿名函数)

3.3 使用Function构造函数声明函数

3.4 自执行函数

先前咱们写的函数只有在调动的时候才会执行,如果像下面这样写的话,代码执行到这一行的时候,函数会自己执行(或者说自己调用自己)。

(function(a){console.log(a);
})("abc")

4. 函数的返回值return

function sum(num1, num2) {var num3 = num1 + num2;return num3;
}
//接受函数执行的返回值
var result = sum(5, 10); //15

注意点:

  • 函数在执行完return语句之后停止并立即退出。因此,位于return语句后面的任何代码永远都不会执行。

  • 一个函数中可以有多个return语句。

  • return语句也可以不带任何返回值。

5. arguments对象

arguments 是一个对应于传递给函数的参数的类数组对象。

可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数,第一个参数在索引 0 处。例如,如果一个函数传递了三个参数,你可以以如下方式引用他们:

function func1(a, b, c) {console.log(arguments[0]);console.log(arguments[1]);console.log(arguments[2]);
}
​
func1(1, 2, 3);

6. 函数是一种数据类型

  • function数据类型

function fn() {}
console.log(typeof fn);//返回值是function
  • 函数作为参数

因为函数也是一种类型,可以把函数作为一个函数的参数,在一个函数中调用

function fun() {console.log('函数哦');};
​
// 函数作为superfun的参数
function superfun(theFun) {theFun();console.log('执行了');
};
​
superfun(fun);

7. 作用域

作用域:指一个变量的作用范围。

目前的学习中,在Javascript将作用域分为 全局作用域函数作用域(局部作用域)。

7.1 全局作用域

代码在程序的任何地方都能被访问,window 对象的内置属性都拥有全局作用域。

7.2 函数作用域(局部作用域)

在固定的代码片段才能被访问

7.3 全局变量和局部变量

变量的作用域范围可分为全局变量和局部变量。

  • 全局变量:

在最外层声明的变量叫全局变量。

在函数体内部,没有使用var关键字声明的变量也是全局变量。(不推荐)

  • 局部变量:

在函数体内部,使用var关键字声明的变量叫作局部变量。

7.4 作用域规则

  • 函数允许访问函数外的数据。

  • 整个代码结构中只有函数可以限定作用域。

  • 作用域规则首先使用提升规则分析。

  • 如果当前作用规则中有名字了, 就不考虑外面的名字。

    注意点:

    局部变量退出作用域之后会销毁,全局变量关闭网页或浏览器才会销毁。

//函数才有局部作用域
var num = 123;
function foo() {console.log( num );
}
foo();
if ( false ) {var num = 123;
}
console.log( num ); // undefiend

7.5 作用域链(重点)

  • 只有函数可以制造作用域结构, 那么只要是代码,就至少有一个作用域, 即全局作用域。凡是代码中有函数,那么这个函数就构成另一个作用域。如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域。

  • 将这样的所有的作用域列出来,可以有一个结构:在当前作用域中没有查到值,就会向上级作用域去查,直到查到全局作用域,这么一个查找过程形成的链条就叫做作用域链

  • 作用域链:采取就近原则的方式来查找变量最终的值。

// 案例1:
function f1() {function f2() {}
}
​
var num = 456;
function f3() {function f4() {    }
}
// 案例2
function f1() {var num = 123;function f2() {console.log( num );}f2();
}
var num = 456;
f1();
*我可以

什么是作用域和作用域链,请解释一下?

作用域(scope)

在 Javascript 中,作用域分为 全局作用域局部作用域

全局作用域:代码在程序的任何地方都能被访问,window 对象的内置属性都拥有全局作用域。

局部作用域:在固定的代码片段才能被访问。

作用域链(scope chain)

在当前作用域中没有查到值,就会向上级作用域去查,直到查到全局作用域,这么一个查找过程形成的链条就叫做作用域链。

8. 预解析

JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。

JavaScript解析器执行JavaScript代码的时候,分为两个过程:预解析过程和代码执行过程。

预解析过程:

  1. 把变量的声明提升到当前作用域的最前面,只会提升声明,不会提升赋值。

  2. 把函数的声明提升到当前作用域的最前面,函数声明代表函数整体,所以函数提升后,函数名代表整个函数。

  3. 先提升var,再提升function。

  4. 预解析会把变量和函数的声明在代码执行之前执行完成。

8.1 变量预解析

预解析也叫做变量、函数提升。 变量提升(变量预解析): 变量的声明会被提升到当前作用域的最上面,变量的赋值不会提升。

8.2 函数预解析

函数提升: 函数的声明会被提升到当前作用域的最上面,函数声明代表函数整体,所以函数提升后,函数名代表整个函数。

fun();
​
function fun() {console.log('函数啊');
};

特殊情况--函数表达式声明函数问题

fn();
var  fn = function() {console.log('想不到吧');
}
//结果:报错提示 "fn is not a function"
​
//解释:该段代码执行之前,会做变量声明提升,fn在提升之后的值是undefined;而fn调用是在fn被赋值为函数体之前,此时fn的值是undefined,所以无法正确调用

9.综合练习

1.var x;
console.log(x)
x=3;
2.//undefinedvar a = 1;
function test(){console.log(a);var a = 1;
}
test();
3.//3 2 2var b = 1;
function fun1() {b = 2;function fun2() {var b = 3;console.log(b);}fun2();console.log(b);
}
fun1();
console.log(b);
​
4.//2 1var b = 1;
function fun1(b) {b = 2;//对形参进行的操作?console.log(b);
}
fun1('yy');
console.log(b);
​
5.//3 3var b = 2;
function test2() {window.b = 3;console.log(b);
}
test2();
console.log(b);
6.//undefined 3 3c = 5;
function test3() {window.c = 3;console.log(c);var c;console.log(window.c);
}
test3();
console.log(c);

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Redis中处理处理没有ACK确认的Stream

系列文章目录 文章目录 系列文章目录前言前言 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站,这篇文章男女通用,看懂了就去分享给你的码吧。 Stream是一个只能追加内容的数据类型。也就是说Stream这种数据类型,我们…

vue的创建、启动以及目录结构详解

vue的创建、启动以及目录结构详解目录 一. vue项目的创建 二. vue的目录结构 三. src的目录结构 四. vue项目的启动 4.1 方法1 4.2 方法2 一. vue项目的创建 创建一个工程化的Vue项目,执行命令:npm init vuelatest 注意:如果你在这个目…

pdf在浏览器上无法正常加载的问题

一、背景 觉得很有意思给大家分享一下。事情是这样的,开发给我反馈说,线上环境接口请求展示pdf异常,此时碰巧我前不久正好在ingress前加了一层nginx,恰逢此时内心五谷杂陈,思路第一时间便放在了改动项。捣鼓了好久无果…

动态链接dlopen/dlclose/..

dlopen,dlsym,dlclose可以在不去link shared library的前提下,在runtime时调用shared library里面的函数.这样可以实现shared library的覆盖或是省略编译阶段的链接检查.但dlopen/dlclose要谨慎使用,尤其是有些写的不是很好的shared library. 动态链接函…

搜索与图论——Prim算法求最小生成树

在最小生成树问题里&#xff0c;正边和负边都没问题 朴素版prim算法 时间复杂度O(n^2) 生成树&#xff1a;每一次选中的t点&#xff0c;它和集合的距离对应的那条边&#xff0c;就是生成树的一条边 算法流程和dijkstra算法非常相似 #include<iostream> #include<cs…

OKCC的API资源管理平台怎么用?

API资源管理平台&#xff0c;重点是“资源”管理平台&#xff0c;不是API接口管理平台。 天天讯通推出的API资源管理平台&#xff0c;类似昆石的VOS系统&#xff0c;区别是VOS是SIP资源管理系统&#xff0c;我们的API资源管理平台是API资源管理系统&#xff08;AXB、AX、回拨AP…

【御控物联】JavaScript JSON结构转换(7):数组To数组——键值互换属性重组

文章目录 一、JSON结构转换是什么&#xff1f;二、案例之《JSON数组 To JSON数组》三、代码实现四、在线转换工具五、技术资料 一、JSON结构转换是什么&#xff1f; JSON结构转换指的是将一个JSON对象或JSON数组按照一定规则进行重组、筛选、映射或转换&#xff0c;生成新的JS…

【Spring Cache】基于注解的缓存框架 简化redis代码

文章目录 一、介绍二、常用注解三、快速入门3.1 EnableCaching3.2 CachePut3.3 Cacheable3.4 CacheEvict 一、介绍 Spring Cache 是一个框架&#xff0c;实现了基于注解的缓存功能&#xff0c;只需要简单地加一个注解&#xff0c;就能实现缓存功能。 Spring Cache 提供了一层…

带你认识线程

线程的概念 前言&#xff1a; 一个程序运行起来&#xff0c;就会对应一个进程&#xff0c;例如&#xff0c;启动一个 Java 程序&#xff0c;就会创建一个 Java 进程。进程也被称为系统分配资源的基本单位。 一个进程可以包含一个线程&#xff0c;也可以包含多个线程&#xff…

政安晨:【Keras机器学习实践要点】(九)—— 保存、序列化和导出模型

目录 介绍 如何保存和加载模型 保存一个Keras模型 装回模型 设置 保存 例子&#xff1a; 自定义对象 向 load_model() 传递自定义对象 使用自定义对象范围 模型序列化 APIs 内存模型克隆 任意对象序列化和反序列化 保存模型权重 内存中的权重传递接口 无状态层…

新能源充电桩站场视频汇聚系统建设方案及技术特点分析

随着新能源汽车的普及&#xff0c;充电桩作为新能源汽车的基础设施&#xff0c;其安全性和可靠性越来越受到人们的关注。为了更好地保障充电桩的安全运行与站场管理&#xff0c;TSINGSEE青犀&触角云推出了一套新能源汽车充电桩视频汇聚管理与视频监控方案。 方案采用高清摄…

甲骨文护城河(MOAT)分析工具-用户指南

甲骨文护城河&#xff08;MOAT&#xff09;分析工具-用户指南 登录后&#xff0c;您可以通过显示的基于web的用户界面访问Moat Analytics Dashboard。 以下是如何通过UI使用护城河的指南的使用目录&#xff1a; 一、主屏幕导航 在面板中创建警报和导出 二、无效流量概述 什…

深入浅出MHA(MySQL Master High Availability)集群:原理、部署与实践

目录 引言 一、MHA集群介绍 &#xff08;一&#xff09;什么是MHA &#xff08;二&#xff09;MHA集群原理 &#xff08;三&#xff09;同步方式 &#xff08;四&#xff09;管理节点与数据节点 二、实现MHA &#xff08;一&#xff09;搭建主从复制环境 1.搭建时间同…

Github profile Readme实现小游戏[github自述游戏]

Github profile Readme常用于个人主页介绍&#xff0c;将它与action自动化流程结合&#xff0c;可以实现一些小游戏 例如&#xff1a;2048、五子棋 2048实现 losehu (RUBO) GitHub 五子棋 https://github.com/losehu/losehu/tree/main 通过python/C编写可执行文件&#xf…

智能网关BL102E采集西门子PLC S7-200 Smart数据上传至Thingsboard

1、WAN口采集西门子PLC的配置 WAN口可以添加很多设备,具体我们用西门子为例来简要配置。 双击WAN,弹出以太网设置,直接把自动获取IP打开,他会根据你的网段自动设置链接! (1)点击`WAN",点击鼠标右键,点击“添加",弹出设备配置框。 (2)设备名称任意填写,如…

《数据结构学习笔记---第七篇》---栈和队列的OJ练习

1. 括号匹配问题。OJ链接 step1:思路分析 &#xff1a; 1.括号匹配&#xff0c;我们首先考虑用栈实现&#xff0c;我们通过符号栈帧的思想知道&#xff0c;求前中后缀表达式的时候用的就是栈帧&#xff0c;操作数栈和符号栈。 2.根据常见的情况 考虑怎么使用栈&#xff0c;首先…

Bun安装与使用

Bun安装与使用。 它目前无法在windows上直接安装使用&#xff0c;必须通过虚拟机安装。 在win10虚拟机中安装 # 查看内核版本 $ uname -srm Linux 6.1.0-10-amd64 x86_64# 安装unzip解压工具 $ sudo apt install unzip# 下载安装脚本并开始安装 curl -fsSL https://bun.sh/ins…

SpringBoot使用Redis

1.Spring是如何集成Redis的&#xff1f; Spring Data Redis 引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></dependency><dependency><groupId&…

互联网轻量级框架整合之JavaEE基础

不得不解释得几个概念 JavaEE SUN公司提出来的企业版Java开发中间件&#xff0c;主要用于企业级互联网系统的框架搭建&#xff0c;同时因为Java语言优质的平台无关性、可移植性、健壮性、支持多线程和安全性等优势&#xff0c;其迅速成为构建企业互联网平台的主流技术&#x…

如何使用Docker搭建WBO在线协作工具并实现无公网IP远程编辑本地白板

文章目录 前言1. 部署WBO白板2. 本地访问WBO白板3. Linux 安装cpolar4. 配置WBO公网访问地址5. 公网远程访问WBO白板6. 固定WBO白板公网地址 前言 WBO在线协作白板是一个自由和开源的在线协作白板&#xff0c;允许多个用户同时在一个虚拟的大型白板上画图。该白板对所有线上用…