javascript入门，语法、数据类型等
1.1、概述
JavaScript是一门世界上最流行的脚本语言
一个合格的后端人员，必须精通JavaScript
2、快速入门
2.1、引入JavaScript
-
内部标签
<script>
// ....
</script>
-
外部引入
abc.js
//...
test.html
<script src="abc.js"></script>
测试代码
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- script标签类，写JavaScript程序-->
<!-- <script>-->
<!-- alert('hello,world')-->
<!-- </script>-->
<!-- 外部引入 -->
<!-- 注意：必须成对出现-->
<script src="js/rg.js"></script>
<!-- 不用显示定义type，也默认就是javascript-->
<script type="text/javascript"></script>
</head>
<body>
<!--这里也可以存放-->
</body>
2.2、基本语法入门
<!--JavaScript严格区分大小写！ -->
<script>
// 1.定义变量 变量类型 变量名 = 变量值；
var num = 1;
// alert(num);
// var name = "rongge";
// alert(name);
if (2>1){
alert("true");
}
//console.log(sum)在浏览器控制台打印变量！ 相当于System out printlin();
</script>
浏览器必备调试须知：
2.3、数据类型
变量
var 王者荣耀="倔强青铜" //不能数字开头
number
js不区分小数和整数，Number
123 //整数123
123.1 //浮点数
1.123e3 //科学计数法
-99 //负数
NaN // not a number
Infinity //表示无限大
字符串
'abc' "abc"
布尔值
true , false
逻辑运算
&&
||
! 取反：真即假，假即真
比较运算符（重要）
= 赋值
== 等于（类型不要求一样）
=== 绝对等于（类型也必须一样）
这是JS的一个缺陷，坚持不要使用 == 比较
须知：
-
NaN===NaN,这个与所有的数值都不相等，包括自己
-
只能通过isNaN(NaN)来判断这是数是否是NaN
浮点数的问题
console.log((1/3)===(1-2/3))
尽量避免使用浮点数进行运算，存在精度问题！
Math.abs(1/3-(1-2/3))<0.00000001
null 和 undefined
-
null 空
-
undefined 未定义
数组
java的数组必须是相同类型的对象，JS不要求
<script>
var arr = [1,2,3,4,5,'hello',null,true];
new Array(1,12,3,4,5,'hello');
</script>
取数组下标，如果越界了，就会显示undefined
对象
对象是大括号，数组是中括号
每个属性之间使用逗号隔开，最后一个不需要添加
//相当于Java的 Person person = new Person(1,2,3)
var person = {
name:'rongge',
age:25
}
取对象的值
person.age
25
person.name
'rongge'
2.4、严格检查格式
<!-- 前提：IDEA 需要设置支持ES6语法
'use strict' :严格检查模式，预防JavaScript的随意性导致产生的一些问题
必须写在JavaScript的第一行
局部变量建议都是用 let 去定义
-->
<script>
'use strict'
let i = 1;
//ES6 let
</script>
3、数据类型
3.1、字符串
-
正常字符串我们使用 单引号，双引号包裹
-
注意转义字符
\'
\n
\t
\u4e2d \u#### Unicode字符
\x41 Ascii字符
-
多行字符串编写
//飘符号 tab键上面
var masg=
`hello
world
nihao
你好`
-
模板字符串
'use strict'
let name = "rongge";
let age ="3";
let mag =`你好呀,${name}`
-
字符串长度
console.log(str.length)
-
字符串的可变性，不可变
-
大小写转换
//注意，这里是方法，不是属性了
console.log(student.toUpperCase())
STUDENT
-
substring
console.log(student.substring(1))
VM1161:1 tudent
console.log(student.substring(1,3))
VM1170:1 tu
3.2、数组
Array可以包含任意的数据类型
var arr = [1,2,3,4,5,6] //通过下标取值赋值
arr[0]=1
1、长度
arr.length
注意：假如给arr.length赋值，数组大小就会发生变化，如果赋值过小，元素就会丢失~
2、indexOf，通过元素获得下标索引
arr.indexOf(2)
1
字符串的”1“和数字1是不同的
3、slice() 截取Array的一部分，返回一个新数组，
4、push(),pop()
push: 压入到尾部
pop:弹出尾部的一个元素
5、unshift()，shift() 头部
unshift: 压入到头部
shift:弹出头部的一个元素
6、排序
var rong = ["D","C","A"]
rong.sort()
['A', 'C', 'D']
7、元素反转
rong.reverse()
['D', 'C', 'A']
8、concat():字符串拼接
rong.concat("U","F","O")
['D', 'C', 'A', 'U', 'F', 'O']
rong
['D', 'C', 'A']
注意：concat() 并没有修改数组，而是返回一个新的数组
9、连接符join
rong
['D', 'C', 'A']
rong.join("-")
'D-C-A'
10、多维数组
arr1 = [[1,2],[3,4],[5,6]]
arr1[2][1]
6
3.3、对象
若干个键值对
var person = {
name:"rongge",
age:3,
email:"806451546@qq.com",
score:75
}
js中对象，{.......}表示一个对象，键值对描述属性 xxx：xxx，多个属性之间使用逗号隔开，最后一个属性不加逗号！
JavaScript中的所有的键都是字符串，值是任意对象！
1、对象赋值
person.name="lala"
person.name
'lala'
2、使用一个不存在的对象属性，不会报错！
person.haha
undefined
3、动态的删减属性
delete person.name
true
person
{age: 3, email: '806451546@qq.com', score: 75}
4、动态的添加
person.haha="haha"
'haha'
person
{age: 3, email: '806451546@qq.com', score: 75, haha: 'haha'}
5、判断属性值是否在这个对象中！ xxx in xxx！
'age' in person
true
6、判断一个属性是否是这个对象自身拥有的hasOwnProperty
person.hasOwnProperty('toString')
false
person.hasOwnProperty('email')
true
3.4、流程控制
forEach循环
var age = [12,3,12,3,12,3,12,3,123];
//函数
age.forEach(function (value) {
console.log(value)
})
3.5、Map 和 Set
Map:
//学生的成绩，学生的名字
// var names = ["tom","jack","haha"];
// var scores = [100,90,80];
var map = new Map([["tom",100],["jack",90], ["haha",80]]);
let name = map.get('tom'); //通过key获得value
map.set("guaiguai",50); //新增或修改
map.delete("tom"); //删除
Set:无序不重复的集合
var set = new Set([3,1,11,1])//set可以去重
set.add(2); //添加
set.delete(1) //删除
console.log(set.has(11)) //是否包含某个元素
3.6、iterator
遍历数组
// 通过for of / for in 是显示下标
var arr = [3,4,5];
for(var x of arr){
console.log(x)
}
遍历map
var map = new Map([["tom",100],["jack",90],["haha",80]]);
for(let x of map){
console.log(x)
}
遍历set
var set = new Set([1,2,3,4,5]);
for(let x of set){
console.log(x)
}
浙公网安备 33010602011771号