JavaScript学习（一）

学习了javascript的基础的一部，简单的总结一下，包括：

Javascript的历史
Javascript的入门
数据类型
流程控制

一、JavaScript历史

JavaScript是一种弱脚本语言，做为开发web页面的脚本语言而出名，也被用到了很多非浏览器环境中

vaScript在1995年由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。

javaScript的标准是ECMAScript 。

2015年6月17日，ECMA国际组织发布了ECMAScript 的第六版，该版本正式名称为 ECMAScript 2015，但通常被称为ECMAScript 6 或者ES6。

开发人员一般编写代码使用的是ES6的环境，但是很多浏览器的只支持ECMAScript 5.1。

JavaScript可以说是最流行的脚本语言之一。所以后台开发人员必须精通JavaScript。

二、Javascript的入门

2.1简单的Javascript代码与两种引入方式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--script标签内次哦JavaScript代码--><!--养成习惯,分号结尾--><script>alert('helloworld');</script>
</head>
<body></body>
</html>

JavaScript代码有两种引入方式

第一种为上面代码所用的行内式

第二种为行外式

即在外部js文件中写好js代码，然后引入。一般使用第二种方式。

2.2 简单的定义变量与流程控制

     <script>var num=1;if (num<2){alert(num);}</script>

2.3 单行注释和多行注释

<script>//单行注释/** 多行注释* 多行注释*/var num=1;if (num<2){alert(num);}</script>

2.4 输入输出语句

 <script>//在浏览器弹出弹窗alert('100');//在控制台打印console.log('200');//在浏览器弹出输入框,用户可输入信息prompt("请输入密码")</script>

2.5 严格检查模式

因为JavaScript太过随意，且很难报错。所以一般使用严格检查模式。避免一些问题。

 <script>//必须写在script标签里的第一行'use strict'</script>

使用严格检查模式必须先将IDEA调整到ES6

三、数据类型

3.1 定义变量的格式

变量类型变量名 = 变量值 ;

<script> 'use strict'//定义局部变量let num=3;//定义全局变量,不建议使用var word=6;</script>

3.2 运算符

逻辑运算符:

&&-------二者为真则为真

|| -------有一为真即为真

! --------真即假,假即真
比较运算符

JavaScript不同于Java的是

==代表等于(类型不一样，值一样。仍旧等于)

===代表绝对等于（类型一样，值一样，才等于）

3.3 布尔类型

false
true

3.4 数字

JavaScript不区分浮点数和整数。统一都是number

999
999.9999
99e9
-99
NaN//not a number
infinity//无限大

特殊的：NaN不等于任何一个数。包括它自身。

只能通过 isNaN 这个方法来判断是否为NaN

注意：尽量避免使用浮点数进行计算。因为会有精度损失

3.5字符串

JavaScript中，字符串使用单引号和双引号包裹均可。

‘‘abc’’ ‘hello’
多行字符串

用esc键下的`符号。可以定义多行字符串。

转义字符串

'\n'--换行符
'\t'--制表符
'\''--转义字符

模板字符串

//模板字符串
let test='haha';
let testx=`${test},nihao`;
alert(testx)

字符串长度
```
alert(testx.length);
```
字符串的不可变性

字符串的大小写转换

test.toUpperCase();
test.toLowerCase();

字符串的指定字符位置
```
test.indexOf('t');
```

截取字符串

test.substring(1)//从第一个字符串截取到最后一个字符串
test.substring(1,3)//从第一个截到第三个.含头不含尾

3.6 数组

Array可以包含任意的数据类型，一个数组里面可以有多种数据类型

//数组
let arr=[1,'haha',1.3,2E3,'\n'];
alert(arr[1]);

超出数组长度，会报未定义。

 let arr=[1,'haha',1.3,2E3,'\n'];alert(arr[10]);

数组长度

arr.length

注意：JavaScript中，数组长度可以动态变化。给arr.length赋值。数组长度就会变化。

如果赋值过小，元素就会丢失。如果赋值过大。元素空位会补上undefined

indexOf，通过元素获得下标索引
slice，截取字符串。获得一个新的字符串。含头不含尾
```
 let arr=[1,'haha',1.3,2E3,'\n'];let arr2=arr.slice(0,2);alert(arr2);
```

push()，pop() 尾部

//push 压入到尾部
let arr=[1,'haha',1.3,2E3,'\n'];arr.push(3,5,6)alert(arr);
//pop 从尾部弹出let arr=[1,'haha',1.3,2E3,'\n'];arr.push(3,5,6)arr.pop();

unshift()，shift()头部

arr.shift()//从头部弹出一个元素
arr.unshift()//压入到头部

sort()排序

reverse()元素反转

caocat()拼接

concat并没有修改原来的数组,只是返回了一个新的数组

join连接符

3. 7 对象

JavaScript中对象是以键值对的形式表现的

 //对象的定义形式var student={name:"liuyang",age:10,sex:"男"    //属性之间以逗号隔开,最后一个属性不加逗号}

对象赋值
```
student.name="dadada";
```

使用不存在的对象属性

var student={name:"liuyang",age:10,sex:"男"
}
alert(student.email)
//只会报未定义,不会报错

动态的删减增添属性

//动态的增添属性
var student={name:"liuyang",age:10,sex:"男"
}
student.email="9613@qq.com";
alert(student.email);//删减属性
delete student.email;

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

'age' in student
true
//继承的属性也在对象中
'toString' in student
true

判断这个方式是否属于这个对象
```
student.hasOwnProperty('toString')
false
student.hasOwnProperty('age')
true
```
JavaScript中所有键都是字符串,需要加上’’ ''包裹。所有的值都是任意类型

3.8 Map和Set

map

var map=new Map([['黑',100],['白',200],['红',300]]);//创建mapvar number = map.get('黑');   //通过key查value值.map.set('粉',400);            //添加键值对map.delete('黑')           //删除键值对

set

var set =new Set([1,2,2,2,3,4,5]); //创建setset.delete(2)                 //删除值set.add(6)                     //添加值set.has(6)                      //判断是否含有某个元素

遍历

//遍历set
var set =new Set([1,2,2,2,3,4,5]);
for(let x of set){console.log(x)
}//遍历map
var map=new Map([[1,1],[2,2],[3,3],[4,4]]);
for (let x of map){console.log(x)
}//遍历集合
var number=[1,5,5,6,'hong'];
for (let x of number){console.log(x)
}

四、流程控制

1. if语句

var age = 3;
if (age>3){ alert(">3");
}else if(age<5) {  alert("<5");
}else { alert("不知道");
}

2. while循环

//while
while(age<100){age = age + 1;console.log(age)
}
//do while
do{age = age + 1;console.log(age)
}while(age<100)

3. for循环

for (let i = 0; i < 100 ; i++) {console.log(i)
}

4.for each循环

let arr=[1,3,4,5,6];
arr.forEach(function (value) {console.log(value)
})