1.什么是JavaScript
1.1概述
JavaScript一门世界上最流行脚本语言。
一个合格的后端人员,必须精通JavaScript。
1.2历史
ECMAscript它可以理解为JavaScript的一个标准,最新版本已经到es6版本,但是大部分浏览器还只停留在支持es5代码上!
开发环境—线上环境,版本不一致。
2.快速入门
2.1 引入JavaScript
1.内部标签
<script>
//....
</script>
2.外部引入
abc.js
//...
test.html
<script src="abc.js"></script>
2.2基本语法入门
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- Javascript严格区分大小写!-->
<script>
// 1.定义变量 变量类型 变量名=变量值;
var score = 77;
// 2.条件控制
if(score>60&&score<70){
alert("60-70")
}else if(score>70&&score<80){
alert("70-80")
}else{
alert(other)}
// 3.多行注释 /* */
// 4.console.log(score) 在浏览器的控制台打印变量!System.out.println()
// 5.
</script>
</head>
<body>
</body>
</html>
浏览器必备知识:
2.3.数据类型
数值 文本 图形 音频 视频…
变量(定义是不能以数字开头)
var 王者荣耀="倔强青铜"
number
js不区分小数和整数 Number
123 //整数123
123.1 //浮点数123.1
1.123e3//科学计数法
-99 //负数
NaN //not a number
Infinity //表示无限大
字符串
‘abc’ ‘‘abc’’
布尔值
true , flase
逻辑运算
&&
||
!
比较运算符
= 赋值
== 等于(类型不一样,值一样,也会判断为true)
=== 绝对等于(类型和值一样)
须知:
- NaN与所有的数值都不想等,包括自己
- 只能通过isNaN(NaN)来判断这个数是否为NaN
浮点数问题:
console.log((1/3)===(1-2/3))
尽量避免使用浮点数进行运算,存在精度问题!
Math.abs(1/3-(1-2/3))<0.00001
null和undefined
- null 空
- undefined 未定义
数组
java的数组必须是相同的类型,一系列相同类型的对象,js中不需要这样!
// 保证代码可读性,尽量使用[]
var arr=[1,2,3,4,5,'hello',null,true]
new Array(1,2,3,4,'hello')
去数组下标,如果越界了,就会 undefined
对象
对象是大括号,数组是中括号
,每个属性之间使用逗号隔开,最后一个不要添加
//Person person=new person(1,2,3,4,5);
var person={
name:"kk",
age:18,
tags:['js','java','web']
}
取对象的值
person.name
"kk"
2.4严格检查格式
(‘use strict’;)
<script>
//'use strict'; 严格检查模式,预防JavaScript的随意性导致产生的一些问题
//'use strict'; 必须写在JavaScript第一行;
//局部变量 建议都是用let去定义
'use strict';
//Es6 let定义局部变量
let i=2;
</script>
3. 数据类型
3.1字符串
- 正常字符串我们使用’ ‘或者“ ”包裹
- 注意转义字符 \
\'
\n
\t
\u4e2d unicode字符
\x41 Ascll字符
- 多行字符串编写
//tab上面的piao
var msg=`
world
你好
kk
`
- 模板字符串
//tab上面的piao
let name ='kk';
let agr=18;
let msg=`
你好呀,
${name}
`
- 字符串长度
str.length
- 字符串的可变性,不可变
student[0]=1
1
console.log(student)
VM361:1 student
- 大小写转换
//注意:这里是方法,不是属性
console.log(student.toLocaleUpperCase())
console.log(student.toLocaleLowerCase())
- student.indexOf(‘u’)
console.log(student.indexOf('u'))
//字符串中u的位置
- substring
console.log(student.substring(1,3))
tu
//字符串中2.3的内容
3.2数组
Array可以包含任意数据类型
var arr =[1,2,3,4,5,6] //通过下标取值和赋值
arr[0]
arr[0]=1;
- 长度
arr.length
注意:假如给arr,length赋值,数组大小会发生变化~如果赋值过小,元素会丢失
- indexOf,通过元素获得下标索引
arr.indexOf(2)
1
字符串的1和数字1是不同的!
- slice()截取Array的一部分,返回一个新的数组
arr=[1,2,3,4,5,6,"1","2"]
(8) [1, 2, 3, 4, 5, 6, "1", "2"]
arr.slice(3)
(5) [4, 5, 6, "1", "2"]
- push和pop(压入尾部和弹出尾部)
arr
(8) [1, 2, 3, 4, 5, 6, "1", "2"]
arr.push('a','b')
10
arr
(10) [1, 2, 3, 4, 5, 6, "1", "2", "a", "b"]
arr.pop()
"b"
arr
(9) [1, 2, 3, 4, 5, 6, "1", "2", "a"]
-
unshift(),shift()(压入头部和弹出头部)(同4)
-
排序 sort()
(5) [1, 2, 3, 4, 5]
arr.unshift(6)
6
arr.sort()
(6) [1, 2, 3, 4, 5, 6]
- 元素反转
arr.reverse()
(6) [6, 5, 4, 3, 2, 1]
- conat()
arr.concat(["a","b","c"])
(9) [6, 5, 4, 3, 2, 1, "a", "b", "c"]
arr
(6) [6, 5, 4, 3, 2, 1]
注意:concat()并没有修改数组,只是返回一个新的数组
- 连接符join
arr
(6) [6, 5, 4, 3, 2, 1]
arr.join('-')
"6-5-4-3-2-1"
打印拼接数组,使用特定的字符串连接
- 多维数组
array=[[1,2],[3,4],["5","6"]];
array [1][1]
4
数组:存储数据(如何存,如何取,方法都可以实现)
3.3对象
若干个键值对,
var 对象名={
属性名:属性值,
属性名:属性值,
属性名:属性值
}
var person={
name:"kk",
age: 3,
email:"17664000187@163.com",
score:0
}
JS中对象,{…}表示一个对象,键值对描述属性xxxx:xxxx,多个属性之间使用逗号隔开,最后一个属性不加逗号。
JavaScript中所有的键都是字符串,