1. 什么是JavaScript?
JavaScript是一门世界上最流行的脚本语言,
Java,JavaScript
10天
== 一个合格的后端人员,必须要精通JavaScript ==
2、快速入门
2.1、引入JavaScript
-
内部标签
<script> //... </script>
-
外部引入
abc.js
<script src="abc.js"> </script>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- script标签内,写JavaScript代码 --> <!-- <script>--> <!-- alert("hellow,world");--> <!-- </script>--> <!-- 外部引入 --> <!-- 注意:script必须成对出现--> <script src="../JS/qj.js"></script> <!-- 不用显示定义类型,也默认是JavaScript --> <script type="text/javascript"></script> </head> <body> <!--这里也可以存放--> </body> </html>
2.2、基本语法入门
<script> //1.定义变量 变量类型 变量名 = 变量值 var num = 1; var name = "hbx"; alert(name); //2.条件控制 if (2>1){ alert(true); } </script>
</head> <body>
</body> </html>
//console.log(name) 在浏览器的控制台打印变量 System.out.printf();
2.3、数据类型
数值,文本,图形,音频,视频....
变量
var 王者荣耀 = "倔强青铜"
number
JS不区分小数和整数
123//整数123 123.1//浮点数123.1 1.23e2//科学计数法 -99//负数 NaN//not a number Infinity//表示无限大
字符串
‘abx’ “abc”
布尔值
true false
逻辑运算
&& --两个都为真 结果为真 || --一个为真,结果为真 ! --真即假 假即真
比较运算符 !!!!
= 1 "1" == --等于(类型不一样,值一样,也会判断为true) === --绝对等于(类型一样,值一样)
JS的缺陷 坚持不要使用==
须知:
-
NaN==NaN 这个与所有的值都不相等,包括自己
-
只能通过isNaN(NaN)来判断true or false
浮点数问题
console.log((1/3) === (1-2/3));
就尽量避免使用浮点数进行运算,存在精度问题!
Math.abs(1/3-(1-2/3))<0.00001
null 和 undefined
-
null 空
-
undefined 未定义
数组
Java的数组必须是一系列相同数据类型的对象~,JS中不需要这样。
var arr={123,2,5,3,1,'holle',bull,true};
取数组下标:如果越界了,就会
undefined
对象
对象是大括号,数组是中括号
每个属性之间使用逗号隔开,最后一个不需要添加
//Person person = new Person(1,2,3,4,5); var person= { name: "hbx", age: 3, tags: ["js", java","web","...."] }
取对象的值
person.name >"hanboxuan" person.age >3
2.4严格检查格式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 前提:IDEA需要支持ES6的语法 'use strict' 代表严格检查模式,预防JavaScript的随意性导致产生的一些问题 必须写在JavaScript第一行 局部变量建议都使用let去定义 --> <script> 'use strict'; //全局变量 let i = 1; //ES6 let </script> </head> <body> </body> </html>
3、数据类型
字符串
-
正常字符串我们使用单引号或者双引号包裹
-
注意转义字符 \
\' 点 \n 换行 \t tab \u4e2d \u#### unicode字符 \x41 Ascll字符
3.多行字符串编写
<script> 'use strict'; //tab 上面 Esc 下面 piao~ var msg = ` hellow wordld niahoa ` </script>
-
模板字符串
<script> 'use strict'; //tab 上面 Esc 下面 piao~ let name = "hbx"; let age = 3; let msg = `你好呀,小赤佬${name}` console.log("msg" + msg); </script>
$$
$$
-
字符串长度
console.log(studnet.length)
-
字符串的可变性,不可变
-
大小写转换 注意这里是方法不是属性
console.log(studnet.toUpperCase()) //大写 console.log(studnet.toLowerCase()) //小写
-
student.indexOf['t']
-
substring
console.log(studnet.substring(1,3))
[) console.log(studnet.substring(1)) //从第一个字符串截取到最后一个字符串 console.log(studnet.substring(1,3)) //包头不包尾
3.2、数组
Array可以包含任意的数据类型
var arr = {1,2,3,4,5,6}//通过下标取值 arr[0] arr[0] = 1
-
长度
arr.length
:6注意:假如给
arr.length
赋值,数组大小就会发生变化~如果赋值过小元素就会丢失 -
indexOf,通过元素获得下标索引
arr.indexOf(2)
:1
字符串的“1”和数字 1 是不同的
-
slice()
截取Array的一部分,返回一个新的数组类似于String中的substring -
push(),pop() 尾部
arr.push():压入到尾部
arr.pop():弹出尾部的一个元素
-
unshift(),shift()头部
arr.shift():压入到头部
arr.unshift():弹出头部的一个元素
-
排序 sort()
(3) ["B","C","A"] arr.sort() (3) ["A","B","C"]
-
元素反转 reverse()
(3) ["B","C","A"] arr.reverse() (3) ["C","B","A"]
-
concat()
(3) ["C","B","A"] arr.concat([1,2,3]) (6) ["C","B","A",1,2,3] arr (3) ["C","B","A"]
注意:concat()并没有修改数组,只会返回一个新的数组
-
连接符join
打印拼接数组,使用特定的字符串连接、
(3) ["C","B","A"] arr.join('-') "C-B-A"
-
多维数组
arr = [[1,2][3,4]["5","6"]]; arr[1][1] 4
数组:存储数据(如何存,如何取,方法都可以自己实现!)
3.3、对象
若干个键值对
var 对象名 = { 对象属性名:属性值, 对象属性名:属性值, 对象属性名:属性值 } //定义了一个person对象,它有两个