【无标题】

DECK: JavaScript

JavaScript 引入方式

![[…/…/obsidian_images/Pasted image 20240401181907.png]]
![[…/…/obsidian_images/Pasted image 20240401181823.png]]

JavaScript 基础语法

三种打印输出

![[…/…/obsidian_images/Pasted image 20240401182147.png]]

变量

Var 是全局变量
Let 是局部变量
![[…/…/obsidian_images/Pasted image 20240401183426.png]]

数据类型

声明但未赋值的 typeof (…)返回 undefined
声明但赋值为 null 的 typeof (…)返回 object
![[…/…/obsidian_images/Pasted image 20240401183919.png]]
![[…/…/obsidian_images/Pasted image 20240401184105.png]]

类型转换

如果将 string 字符串字面值转换成数字的话
字面值不是数字 ‘abc’ 这转化成 NaN (not a number)

![[…/…/obsidian_images/Pasted image 20240401194213.png]]

== 和 === 的区别

#等号的区别
双等号会有一个前置类型转换的过程
![[…/…/obsidian_images/Pasted image 20240401194543.png]]

函数

有两种形式的函数调用语言
形式参数本来也是填 var 语言不如不填
函数调用可以传任意个参数, 他不会报错, 但人家收不收就另说了
![[…/…/obsidian_images/Pasted image 20240401195020.png]]
![[…/…/obsidian_images/Pasted image 20240401195119.png]]

JavaScript 对象

Array 对象

和 Java 中的集合类似, 是那种可变长度和类型的
Array 是对象的话就有对应的属性和方法
![[…/…/obsidian_images/Pasted image 20240401195951.png]]

String 对象

单引号和双引号都 ok var str =’ 123 ’
重点讲一下这个 trim 对象 string. Trim () 方法

自定义对象

![[…/…/obsidian_images/Pasted image 20240401200324.png]]
![[…/…/obsidian_images/Pasted image 20240401200332.png]]

BOM 对象 (Browser Object Model)

![[…/…/obsidian_images/Pasted image 20240401200748.png]]

Window 对象

#定时器
Window 对象的 confirm 对象是有返回值的
![[…/…/obsidian_images/Pasted image 20240401201017.png]]
![[…/…/obsidian_images/Pasted image 20240401201140.png]]
#SetTimeout
![[…/…/obsidian_images/Pasted image 20240401201331.png]]
#定时器案例
![[…/…/obsidian_images/Pasted image 20240401201704.png]]

History 对象

![[…/…/obsidian_images/Pasted image 20240401202137.png]]

Location 对象

看准这里是他的属性
![[…/…/obsidian_images/Pasted image 20240401202246.png]]
![[…/…/obsidian_images/Pasted image 20240401202215.png]]

DOM (文档对象模型)

![[…/…/obsidian_images/Pasted image 20240401203023.png]]
记住这里都是获取的 Element 对象数组
![[…/…/obsidian_images/Pasted image 20240401203421.png]]
![[…/…/obsidian_images/Pasted image 20240401203401.png]]
![[…/…/obsidian_images/Pasted image 20240401204843.png]]

事件监听

![[…/…/obsidian_images/Pasted image 20240401205506.png]]
![[…/…/obsidian_images/Pasted image 20240401205455.png]]

![[…/…/obsidian_images/Pasted image 20240401205619.png]]

综合小案例 --登录时的表单验证通过

![[…/…/obsidian_images/Pasted image 20240401210917.png]]
通过这个小案例真的学到了很多
![[…/…/obsidian_images/Pasted image 20240401210622.png]]
![[…/…/obsidian_images/Pasted image 20240401210609.png]]
![[…/…/obsidian_images/Pasted image 20240401223115.png]]
![[…/…/obsidian_images/Pasted image 20240401223308.png]]

Reduce ()方法