- 一、什么是JavaScript
- 二、快速入门
- 1、引入JavaScript
- 1.1、内部标签
- 1.2、外部引入
- 三、基本语法入门
- 1、浏览器调试须知
- 2、数据类型
- 3、严格检查格式
- 四、数据类型
- 1、字符串
- 2、数组
- 3、对象
- 4、流程控制
- 5、Map、Set
- 6、interator
- 五、函数
一、什么是JavaScript
- JavaScript是一门世界上最流行的脚本语言
- 一个合格的后端人员，必须要精通JavaScript
- ECMAScript可以理解为是JavaScript的一个标准
1.2、外部引入
abs.js
//...
test.html
测试代码
Title
三、基本语法入门
1、浏览器调试须知
2、数据类型
变量
- 所有的变量都使用var关键字
- 变量的命名规则：只要不以数字开头就可以
number
- js不区分小数和整数，都用number
123 //整数 123.1 //浮点数 1.23e3 //科学计数法 -99 //负数 NaN //not a number Infinity //表示无限大
字符串
- ‘abc’ “abc”
布尔值
- true false
逻辑运算
- && 两个都为真，结果为真
- || 一个为真，结果为真
- ！取反
比较运算符
- =
- == 等于（类型不一样，值不一样，也会判断为true）
- === 绝对等于（类型一样，值一样，结果为true）
注：
-
这是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中不需要这样
- 取数组下标，如果越界了就会报undefined
对象
- 对象使用大括号{ }，数组使用中括号[ ]
- 每个属性之间使用逗号隔开，最后一个不需要添加
在控制台取对象的值
person.name >"yuqing" person.age > 33、严格检查格式
Title
四、数据类型
1、字符串
1.1、正常字符串使用单引号或者双引号包裹
1.2、注意转义字符
' n t u4e2d u#### unicode字符 x41 Ascll字符
1.3、多行字符串编写
//tab上面esc键下面的键包裹，可以写多行 var mag= `hello world 你好ya 你好`
1.4、模板字符串
//tab 上面esc键下面
let name="yuqing";
let age=3;
let mag=`你好呀，{name}`
1.5、字符串长度
console.log(student.length)
1.6、字符串的可变性，不可变
1.7、大小写转换
//注意，这里是方法，不是属性 student.toUpperCase() student.toLowerCase()
1.8、获取指定的下标
student.indexOf('t')
1.9、截取字符串
student.substring(1)//[ ) 从第一个字符串截取到最后一个字符串 student.substring(1，3)//[1,3]截头不截尾2、数组
Array可以包含任意的数据类型
var arr=[1,2,3,4,5,6]//定义 arr[0] //通过下标取值 arr[0]=1 //通过下标赋值
2.1、长度
arr.length
注意：
假如给arr.length赋值，数组大小就会发生变化,如果赋值过小，元素就会丢失
2.2、indexOf
- 通过元素获得下标索引
- 字符串的"1"和数字的1是不同的
>arr=[1,2,3,4,5,6,"1","2"]
<(8) [1, 2, 3, 4, 5, 6, '1', '2']
>arr.indexOf("1")
<6
2.3、slice()
- 截取Array的一部分，返回一个新数组，类似于String中的substring
arr=[1,2,3,4,5,6,"1","2"] >arr.slice(3)//从数组第三个开始截取（不包括第三个），截取后面所有的 <(5) [4, 5, 6, '1', '2'] >arr.slice(1,5) <(4) [2, 3, 4, 5]//不包括前面的，包括后面的
2.4、push()、pop()尾部
- push：压入到尾部
- pop：弹出尾部的一个元素
>arr=[1,2,3,4,5,6,"1","2"]
<(8) [1, 2, 3, 4, 5, 6, '1', '2']
>arr.push('a','h')
<10
>arr
<(10) [1, 2, 3, 4, 5, 6, '1', '2', 'a', 'h']
>arr.pop()
<'h'
2.5、unshift()、shift()头部
- unshift：压入到头部
- shift：弹出头部的一个元素
>arr=[1,2,3,4,5,6,"3"]
<(7) [1, 2, 3, 4, 5, 6, '3']
>arr.unshift('a','b')
<9
>arr
<(9) ['a', 'b', 1, 2, 3, 4, 5, 6, '3']
>arr.shift()
<'a'
>arr
<(8) ['b', 1, 2, 3, 4, 5, 6, '3']
2.6、数组排序sort()
>arr=["A","C","B"] <(3) ['A', 'C', 'B'] >arr.sort() <(3) ['A', 'B', 'C']
2.7、元素反转 reverse()
arr=["A","C","B"] (3) ['A', 'C', 'B'] arr.reverse() (3) ['C', 'B', 'A']
2.8、== concat==
arr=["A","C","B"] (3) ['A', 'C', 'B'] arr.concat([1,2,3]) (6) ['C', 'B', 'A', 1, 2, 3] arr (3) ['C', 'B', 'A']
注意：concat(）并没有修改数组，只是会返回一个新的数组
2.9、连接符 join
- 打印拼接数组，使用特定的字符串连接
arr
(3) ['C', 'B', 'A']
arr.join('-')
'C-B-A'
2.10、多维数组
>arr=[[1,2],[3,4],["5","6"]] >arr[1][1] <4
数组：存储数据（主要知道如何存、如何取，方法可以自己实现）
3、对象- js中对象，{…}表示一个对象
- 键值对描述属性 xxxx：xxxx，多个属性之间使用逗号隔开，最后一个属性不加逗号
- javascript中的所有的键都是字符串，值是任意对象
var 对象名={
属性名：属性值
属性名：属性值
属性名：属性值
}
//定义了一个person对象，它有四个属性
var person={
name:"yuqing",
age:3,
email:"2569873@qq.com",
score:0
}
3.1、 对象赋值
person.name 'yuqing' person.age 3 person.name="liangyu" 'liangyu'
3.2、使用一个不存在的对象属性，不会报错！undefined
person.haha undefined
3.3、动态的测试属性
- 通过delete删除对象的属性
delete person.name
true
person
{age: 3, email: '2569873@qq.com', score: 0}
3.4、动态的添加
- 直接给新的属性添加值即可
person.haha="haha"
'haha'
person
{age: 3, email: '2569873@qq.com', score: 0, haha: 'haha'}
3.5、判断属性值是否在对象中：xxx in xxx！
"age" in person true //继承 'toString' in person true
3.6、判断一个属性是否是这个对象自身拥有hasOwnProperty
person.hasOwnProperty('toString')
false
person.hasOwnProperty('age')
true
4、流程控制
4.1、if判断
4.2、while循环,避免死循环
var age=3;
while(age<100){
age=age+1;
console.log(age);
}
4.3、for循环
for (let i = 0; i < 100; i++) {
console.log(i)
}
4.4、forEach循环
var age=[12,3,12,3,12,3,12,31,23,123];
//函数
age.forEach(function(value){
console.log(value)
})
4.5、for…in
//for(var index in object){}
for(var num in age){
if(age.hasOwnProperty(num)){
console.log("存在");
console.log(age[num]);
}
}
5、Map、Set
ES6的新特性
5.1 、Map
5.2、Set
- 无序不重复的集合
var set=new Set([3,1,1,1,1]);//set可以去重
set.add(2);//添加
set.delete(1);//删除
console.log(set.has(3));//是否包含某个元素
6、interator
es6新特性
遍历数组
//通过for of实现
var arr=[3,4,5];
for(var x of arr){//打印具体的值
console.log(x);
}
//for in
for(var x in 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( [5,6,7]);
for(let x of set){
console.log(x)
}
五、函数
