一.JavaScript
- JavaScript一门弱类型脚本语言,其源代码在发往客户端运行之前不需经过编译,而是将文本格式的字符代码发送给浏览器由浏览器解释运行。
- 浏览器必备调试须知 :
二.数据类型
数值,文本,图形,音频,视频…
- 变量
var 王者 = "青铜”
; //可以使用中文 - number
- JavaScript不区分小数和整数,Number
123.1 //浮点数
1.123e3 //科学计数法
NaN //not a number
Infinity //表示无限大
- 字符串(‘a,b,c’ “a,b,c”)
- 布尔值(true,false)
- 逻辑运算
&& : 两个都为真,结果为真
|| : 一个为真,结果为真
! : 真即假,假即真 - 比较运算符
- =
- == : 等于(类型不一样,值一样,也会判断为true)
- === :绝对等于(类型一样,值一样,结果为true)
注意: NaN===NaN,这个与所有的数值都不相等,包括自己
只能通过isNaN(NaN)来判断这个数是否是NaN
4.console.log((1/3) === (1-2/3)) : 尽量避免使用浮点数进行运算,存在精度问题
- null和undefined
null : 空
undefined : 未定义 - 数组
Java的数组是相同类型的对象,JavaScript中不需要这样
//保证代码的可读性,尽量使用[]
var arr = [1,2,3,4,5,'hello',null,true];
new Array(1,12,3,4,4,5,'hello')
取数组下标 : 如果越界了,就会 undefined
- 对象
对象是大括号,数组是中括号
每个属性之间使用逗号隔开,最后一个不需要添加
//Person person = new Person(1,2,3,4,5);
var person = {
name: "juju",
age: 3,
tags:['js','java','web','...']
}
取对象的值
person.name
>"juju"
person.age
>3
use strict : 严格检查模式,预防JavaScript的随意性导致产生的一些问题必须写在JavaScript的第一行!
- 前提 : IDEA需要设置支持ES6语法
- 局部变量建议都使用let去定义
三.变量的作用域
在JavaScript中,var定义变量实际是有作用域的
- 在函数体中声明变量,则在函数体外不可用
- 如果两个函数使用了相同的变量名,只要在函数内部,就不冲突
- 假设在JavaScript中,函数查找变量从自身函数开始,由内向外查找。假设外部存在这个同名的函数变量,则内部函数会屏蔽外部函数的变量
- 这个是在JavaScript建立之初就存在的特性。养成规范 : 所有的变量定义都放在函数的头部,不要乱放,便于代码维护。
- 把自己的代码全部放入自己定义的唯一空间名字中,降低全局命名冲突的问题。建议都用let去定义局部作用域的变量
- Javascript 实际上只有一个全局作用域,任何变量(函数也可以视为变量),假设没有在函数作用范围内找到,就会向外查找,如果在全局作用域都没有找到,报错RefrenceError
四.JSON
早期,所有数据传输习惯使用XML文件!
- JSON是一种轻量级的数据交换格式。
- 简洁和清晰的层次结构使得JSQN成为理想的数据交换语言。
- 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。
在JavaScript 一切皆为对象、任何js支持的类型都可以用JSON来表示;Number,String…
格式:
- 对象都用{ }
- 数组都用[ ]
- 所有的键值对都是用key:value
五.Ajax
- 原生的js写法 xhr异步请求
- jQuey封装好的方法 $("#name").ajax("")
- axios请求
六.操作BOM对象
- JavaScript诞生就是为了能够让它在浏览器中运行
- BOM: 浏览器对象模型
- window代表浏览器窗口
- Navigator,封装了浏览器信息
- screen 代表屏幕尺寸
- location 代表当前页面的url信息
- document 代表当前的页面,HTML,DOM文档树
- history 代表浏览器的历史记录
七.操作DOM对象
浏览器网页就是一个Dom树形结构!
- 更新: 更新Dom节点
- 遍历dom节点: 得到Dom节点
- 删除: 删除一个Dom节点
- 添加: 添加一个新的节点
要操作一个Dom节点,就必须要先获得这个Dom节点
删除节点
- 删除节点的步骤:先获取父节点,再通过父节点删除自己
- 删除是一个动态的过程
- 注意:删除多个节点的时候,children是在时刻变化的,删除节点的时候一定要注意
插入节点
- 我们获得了某个Dom节点,假设这个dom节点是空的,我们通过innerHTML就可以增加一个元素了,但是这个DOM节点已经存在元素了,我们就不能这么干了,会产生覆盖。
操作表单(验证)
- 文本框 text
- 下拉框< select >
- 单选框 radio
- 多选框 checkbox
- 隐藏域 hidden
- 密码框 password
表单的目的:提交信息