JavaScript
2020-09-25 14:42:27 27 举报
AI智能生成
js
作者其他创作
大纲/内容
数据类型
基本数据类型
Number
String
boolean
undefinded
null
对象类型
object
数据类型的转换
数字转字符串
number + ''
number.toString()
String()
new String()不推荐
字符串转数字
parseInt(String)
将数字字符串转为number并去掉小数部分
parseFloat(String)
Number(String)
若字符串内容不为数字,则返回NaN(不合法数字)
非空的非数字字符串转number为NaN,空字符串转number为0
数字转boolean
Boolean()
非0数字转boolean都为true
0转boolean为false
字符串转boolean
Boolean()
非空字符串转boolean都为true
null转boolean为false
判断数据类型
type of
typeof()
流程控制语句
条件控制语句
if
switch case
循环控制语句
for
for in
用于遍历对象的属性
for of
相当于Java中的foreach,底层用的js的一种迭代器
while
do-while
循环关键字
break
continue
函数
声明
调用
函数名()
调用方法时参数可传可不传,一定要注意形参和实参按位置一一对应
参数
形参不必声明数据类型
形参与实参一一对应
不传也不会报错,多传也没有意义,只使用一一对应的实参
不传则为undefined
arguments
方法内置参数数组
在方法不写形参但传了实参时,可以从该数组取出参数
return
方法不必声明返回值类型,如果有返回值,直接return即可
重名方法
后覆盖前
参数默认值
内置对象
数学对象Math
abs()绝对值
PI
pow(x, n)
sqrt(x)
ceil(x)
floor(x)
round(x)四舍五入
rondom()0-1随机数
三角函数
字符串对象
lenght属性
charAt(index)
charCodeAt(index)
concat(str...str)
indexOf(str)
slice(startIndex, endIndex)
substring(start, end)
substr(start, length)
数组对象
声明定义
特点
可变
可混合存放任意类型
遍历
API
concat()
join()
pop()
shift()
unshift()
push()
reverse()
slice(start, end)
splice(start, length,arg...arg)
sort()
Number
Date
Boolean
ajax
什么是ajax
AJAX = Asynchronous JavaScript and XML
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
Ajax是一种用于创建快速动态网页的技术,通过在后台与服务器进行少量
数据传输,异步地进行页面地局部刷新
数据传输,异步地进行页面地局部刷新
请求与响应完整步骤
1.创建XMLHttpRequest对象
2.调用xhr对象的open方法打开一次请求
method参数,表示请求方式,例如get、set
url请求地址
async,表示同步异步,默认为true同步
3.绑定请求状态监听事件并传回调函数,在回调函数中获取响应
调用xhr的属性onreadystatechange绑定请求状态改变事件
请求状态
0:请求未初始化,open还没有调用
1:服务器连接已建立,open已经调用了
2:请求已经接收,也就是接收到头信息了
3:请求处理中,也就是接收到响应主体了
4:请求已完成,且响应已就绪,也就是响应完成了
获取请求状态
调用xhr的readyState属性可以返回当前请求状态参数
在回调函数中获取响应信息并进行一定处理(将数据渲染到页面)
4.调用xhr的send方法发送请求,当请求方式为get时,send方法不需要传参数,当为post时,需要传string类型的参数
xhr获取响应
xhr.responseText:获得字符串形式的相应数据
xhr.responsXML:获得XML形式的相应数据
xhr.status和xhr.statusText:以数字和文本形式返回http状态码
xhr.getAllResponseHeader():获取所有的响应报头
xhr.getResponseHeader():查询响应中的某个字段的值
xhr.readyState属性:响应返回成功的时候得到通知
json
什么是Json
类似XML,也是一种数据格式
特点
纯文本
人类可读
层次结构清晰,类似于键值对
使用数组,存放的数据与js对象格式一样
可以用Ajax传输
与XML的区别
什么是xml
xml是一种标记语言,常用于数据存储和传输
特点
使用大量标签标记,文件庞大
没有标签,xml标签很占地方,所以Json更小
速度更快
使用数组
不使用保留字
意义
是规范,让所有语言的数据遵循这个规范从而能使不同语言开发的软件在网络上进行交互
转换
js对象转json字符串
JSON.stringify(js对象)
json格式的字符串转js对象
JSON.parse(json字符串)
将json格式的字符串转为js对象会返回一个js对象数组
与xml区别
语言介绍
什么是js
JavaScript是网景公司开发的一种由浏览器解释执行的脚本语言,需要嵌入到html中运行,简称Js
JavaScript是一种动态、弱类型、基于原型的面向对象语言
他的解释器被称为JavaScript引擎,为浏览器的一部分
js的特点
1.是一种解释性脚本语言(代码不进行预编译)
2.代码可以保存在.js文件里,也可以直接写在html文件里
3.JavaScript基于对象,不是纯粹的面向对象语言,比如没有定义类的语法,也没有继承和多态
4.JavaScript是一种弱类型语言,即在变量声明时不能明确声明其类型,变量的类型在运行时确定,并且可以随时改变
5.跨平台性,与任何操作系统无关,只要有浏览器的地方就能运行
js的作用
2.读写html元素,实现一些动态效果(图片切换、图片轮播等等)
3.访问浏览器,获得浏览器的一些信息(浏览器的类型、版本)
4.对浏览器事件做出响应
5.操作cookie、ajax核心技术之一
1.在数据提交到服务器之前验证数据
2.读写html元素,实现一些动态效果(图片切换、图片轮播等等)
3.访问浏览器,获得浏览器的一些信息(浏览器的类型、版本)
4.对浏览器事件做出响应
5.操作cookie、ajax核心技术之一
基础语法
js代码写在哪
写在html的script标签中
写在js文件中并用script在页面引入
注意:一个script只能做一件事(引入js文件或者写js代码)
输出语句
console.log()控制台输出
alert()
可以被用户禁止
样式不可修改
阻塞界面
功能不可定制化
document.write():向body标签内输出内容
标识符
区分大小写
组成
数字
字母
下划线_
$
规定
不可以以数字开头
不能使用关键字
不能包含组成以外的符号
关键字
变量
1.定义变量使用var关键字,var 变量名 = 变量值;
2.Js为弱类型语言,一个变量可以赋不同类型的值
3.Js变量的类型可以在运行期间改变
运算符
算数运算符
+
-
*
/
结果为数学运算结果
%
赋值运算符
=
+=
*=
/=
-=
%=
比较运算符
==
===
>
<
>=
<=
!=
逻辑运算符
&&
||
!
一元运算符
++
--
三元运算符
三目表达式
事件
表单事件
onchange事件
用户改变域的内容
onsubmit
onselect
文本被选中
onreset
重置按钮被点击
加载事件
onabort
图像加载被中断
onerror
加载文档或图片发生错误
onload
图像或页面加载完成
onunload
用户退出界面
焦点事件
onfocus
元素获得焦点
onblur
元素失去焦点
鼠标事件
onclick
ondblclick
onmousedown
onmousemove
onmouseout
onmouseover
onmouseup
键盘事件
onkeydown
onkeypress
onkeyup
事件对象
evnet
绑定事件的三种方式
在标签上使用属性直接绑定,即直接使用上述所有时间属性,值赋为一个函数
脚本访问事件
脚本访问addEventListener
事件冒泡
当一个事件触发后会将事件传到父元素
cancelBubble属性的true和false表示是否阻止冒泡
this指向
this的指向取决于代码运行环境
js中直接声明函数相当于把函数绑定给window,此时this指向window
将一个函数直接赋给一个节点,则this指向这个节点标签,例如脚本访问事件
this指向可以通过bind函数改变,必须赋值并传新的指向,且新函数与原函数逻辑一样
在标签中使用属性绑定事件,可以在绑定函数时传一个this,此时的this就指向该标签
对象模型
DOM
依托于浏览器,只有js代码在浏览器执行才可用
获取节点
getElementById(id值);
getElementsByName()
getElementsByTagName()
getElementsByClassName()
操作节点
操作标签内容
innerHTML
innerText
操作标签属性
w3cdom
获取属性getAttribute(name)
设置属性setAttribute(name, value)
移除属性removeAttribute(name)
优缺点
提供了一种规范,支持自定义属性
在html中看不到的属性则获取不到
htmldom
获取属性
节点.属性名
特例
获取class属性应该节点.className
设置属性
节点.属性名 = 值
优缺点
可以获取到在html中看不到的属性
不支持自定义属性
BOM
Window
Screen
Location
History
正则表达式
0 条评论
下一页