Diary23-Javascript学习（上）

Javascript学习（上）

1.什么是Javascript

• Javascript是一门世界上最流行的脚本语言

• 一个合格的后端人员，必须要精通Javascript

2.快速入门

2.1引入Javascript

2.1.1内部标签

<!--script标签内，写Javascript-->
 ?<script>
 ? ?alert('hello world');
 ?</script>

2.1.2外部引入

<!--外部引入-->
 ?<script src="HelloWorld.js"></script>

2.2基本语法

<script>
 ? ? ? ?var num=1;
 ? ? ? ?alert(num);
</script>

2.3数据类型

• 数值

• 字符串

• 布尔值

• 逻辑运算

• 比较运算符(这个和Java不太一样)

1.=
2.== ? 等于(类型不一样，值一样，也会判断为true)
3.===  绝对等于(类型一样，值一样，才会判断为true,Javascript中推荐使用这个)
?
注意：
1.NaN===NaN，这个与所有的数值都不相等，包括自己
2.只能通过isNaN(NaN)来判断这个数是否是NaN

• 浮点数问题

• null和undefined(这个和Java不太一样)

1.null  空
2.undefined  未定义

• 数组(Java的数组必须是相同类型的对象，Js中不需要这样，可以是不同类型的对象)

var arr=[1,2,3,'hello',null,true]
//取数组下标：如果越界了，就会报undefined

• 对象(对象是大括号，数组是中括号)

每个属性之间使用逗号隔开，最后一个不需要添加

3.数据类型

3.1字符串

• 正常字符串使用单引号、双引号进行包裹

• 注意转义字符

1.\n
2.\t
3.\u4e2d ? \u#### ? Unicode字符
4.\x41 ? ? ? ? ? ?  Ascll字符

• 多行字符串编写

//tab上面，Esc的下面
 ? ? ?  var msg=`hello
 ? ? ?  world
 ? ? ?  你好`

• 模板字符串

let name="sxc";
let age=22;
let msg='${name}最帅'

• 字符串长度

str.length

• 字符串不可变

• 大小写转换

//这里是方法，不是属性
student.toUpperCase()
student.toLowerCase()

• 查找字符串中字母所在位置

student.indexOF('u')

• 字符串的截取

student.substring()

3.2数组

Array可以包含任意的数据类型

var arr=[1,2,3,'hello',null,true]

• 长度

arr.length
注意：加入给arr.length赋值，数组大小会发生变化，如果赋值过小，元素就会丢失

• 下标索引

arr.indexOf()

• slice():截取Array的一部分，返回一个新数组，类似于String中的substring

• push和pop/unshift和shift

1.push:加入到尾部
2.pop：弹出尾部的一个元素
3.unshift:加入到头部
4.shift：弹出头部的一个元素

• 排序sort()

• 元素反转reverse()

• concat()

注意：concat()并没有修改数组，只是会返回一个新的数组

• 连接符join：打印拼接数组，使用特定的字符串连接

• 多维数组

3.3对象

• 对象赋值

var person{
 ? ?name:sxc,
 ? ?age:22,
 ? ?score:100
}

• 使用一个不存在的对象不会报错(undefined)

• 动态的删减属性，通过delete删除对象的属性

• 动态的添加，直接给新的属性添加值即可

• 判断属性是否在这个对象中

'age' in person

• 判断一个属性是否是这个对象自身拥有的hasOwnProperty()

person.hasOwnProperty('age')
true

3.4流程控制

• if判断

if(){
 ? ?
}else if(){
?
}else{
?
}

• while循环/do while循环

while(){
 ? ?
}
?
do{
 ? ?
}while()

• for循环

for(let i=0;i<100;i++){
 ? ?
}

• forEach循环

age.forEach(function(value))

• for...in

//for(var index in object){
 ? ?for(var num in age){
        if(age.hasOwnProperty(num)){
 ? ? ? ? ? ?console.log("存在")
 ? ? ? ? ? ?console.log(age[num])
 ? ? ?  }
 ?  }
}

3.5 Map和Set

Map:

var map=new Map([['tom',100],['jack',90],['Rose',80]]);
var name=map.get('tom');
map.set('admin',123456);

Set:无序不重复的集合

set.add(2);
set.delete(1);
console.log(set.has(3));

3.6 Iterator

使用Iterator来遍历迭代Map，Set

• 遍历数组

//通过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],['Rose',80]]);
for (var x of map){
 ? ?console.log(x)
}

• 遍历set

var set=new set([5,6,7])
for (let x of set){
 ? ?console.log(x)
}