[JavaScript] 第五章函数、事件处理、作用域

春花秋月何时了，往事知多少。此付费专栏不要订阅，不要订阅，听人劝。

🌹作者主页：青花锁 🌹简介：Java领域优质创作者🏆、Java微服务架构公号作者😄

🌹简历模板、学习资料、面试题库、技术互助

🌹文末获取联系方式 📝

系列专栏目录

[Java项目实战] 介绍Java组件安装、使用；手写框架等

[Aws服务器实战] Aws Linux服务器上操作nginx、git、JDK、Vue等

[Java微服务实战] Java 微服务实战，Spring Cloud Netflix套件、Spring Cloud Alibaba套件、Seata、gateway、shadingjdbc等实战操作

[Java基础篇] Java基础闲聊，已出HashMap、String、StringBuffer等源码分析，JVM分析，持续更新中

[Springboot篇] 从创建Springboot项目，到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回、全局异常处理、Swagger文档

[Spring MVC篇] 从创建Spring MVC项目，到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回

[华为云服务器实战] 华为云Linux服务器上操作nginx、git、JDK、Vue等，以及使用宝塔运维操作添加Html网页、部署Springboot项目/Vue项目等

[Java爬虫] 通过Java+Selenium+GoogleWebDriver 模拟真人网页操作爬取花瓣网图片、bing搜索图片等

[Vue实战] 讲解Vue3的安装、环境配置，基本语法、循环语句、生命周期、路由设置、组件、axios交互、Element-ui的使用等

[Spring] 讲解Spring(Bean)概念、IOC、AOP、集成jdbcTemplate/redis/事务等

前言

本章介绍JavaScript的函数、事件处理、作用域等。

1、函数

函数是一组执行特定任务（具有特定功能）的，可以重复使用的代码块

function functionName(parameter_list) {
	// 函数中的代码
}

function sayHello(name){
	document.write("Hello " + name);
}

// 调用 sayHello() 函数
sayHello('清华大学');
function sayHello(name = "World"){
	document.write("Hello " + name);
}

sayHello();                 // 输出：Hello World
sayHello('qh.com');     // 输出：Hello qh.com

函数表达式

var myfunction = function name(parameter_list){
	// 函数中的代码
};

2、事件（event）处理

JS 事件（event）是当用户与网页进行交互时发生的事情

事件	事件	描述
鼠标、键盘事件	onclick	点击鼠标时触发此事件
–	ondblclick	双击鼠标时触发此事件
–	onmousedown	按下鼠标时触发此事件
–	onmouseup	鼠标按下后又松开时触发此事件
–	onmouseover	当鼠标移动到某个元素上方时触发此事件
–	onmousemove	移动鼠标时触发此事件
–	onmouseout	当鼠标离开某个元素范围时触发此事件
–	onkeypress	当按下并松开键盘上的某个键时触发此事件
–	onkeydown	当按下键盘上的某个按键时触发此事件
–	onkeyup	当放开键盘上的某个按键时触发此事件
窗口事件	onabort	图片在下载过程中被用户中断时触发此事件
–	onbeforeunload	当前页面的内容将要被改变时触发此事件
–	onerror	出现错误时触发此事件
–	onload	页面内容加载完成时触发此事件
–	onmove	当移动浏览器的窗口时触发此事件
–	onresize	当改变浏览器的窗口大小时触发此事件
–	onscroll	当滚动浏览器的滚动条时触发此事件
–	onstop	当按下浏览器的停止按钮或者正在下载的文件被中断时触发此事件
–	oncontextmenu	当弹出右键上下文菜单时触发此事件
–	onunload	改变当前页面时触发此事件
表单事件	onblur	当前元素失去焦点时触发此事件
–	onchange	当前元素失去焦点并且元素的内容发生改变时触发此事件
–	onfocus	当某个元素获得焦点时触发此事件
–	onreset	当点击表单中的重置按钮时触发此事件
–	onsubmit	当提交表单时触发此事件

2.1、事件绑定

事件只有与 HTML 元素绑定之后才能被触发

onclick、onmouseover 、onmouseout 、onkeydown 、onkeyup 、onblur、onchange

例子，图片放大缩小



   
    图片

3、作用域

3.1、全局作用域

最外层的函数和在最外层函数外面定义的变量拥有全局作用域；
所有未定义直接赋值的变量拥有全局作用域；
所有 window 对象的属性拥有全局作用域，例如 window.name、window.location、window.top 等。

3.2、局部作用域

在函数内部声明的变量具有局部作用域，拥有局部作用域的变量也被称为“局部变量”

function myFun(){
	var str = "Hello World!";
	document.write(str);    // 输出：Hello World!
}
document.write(str);        // 报错：str is not defined

联系方式

微信公众号：Java微服务架构

在这里插入图片描述

本文来自网络，不代表协通编程立场，如若转载，请注明出处：https://net2asp.com/b664e97c9b.html

[JavaScript] 第五章 函数、事件处理、作用域