前言
本文为JavaScript基础知识与语法介绍，Java全栈学习路线可参考：【Java全栈学习路线】最全的Java学习路线及知识清单，Java自学方向指引，内含最全Java全栈学习技术清单~
一、什么是JavaScript
1.JavaScript概述
JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言
JavaScript是世界上最流行的脚本语言
外观看起来像Java，因此取名为JavaScript
JavaScript兼容于ECMA标准，因此也称为ECMAScript
2.javaScript有什么作用
嵌入HTML中，与Css一样
对浏览器事件作出响应
操作HTML元素及节点
可以动态操作CSS样式
在数据被提交到服务器之前验证数据
二、JavaScript快速入门
1.引入JavaScript
内部标签
<script> window.alert("你好，王先生！"); </script>
外部引入
<script src="js/fistjs.js"></script>
测试代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--script标签内写JavaScript代码，script标签必须成对出现，不用显式定义type，默认就是JavaScript--> <script type="text/javascript"></script> <!--第一种方式，内部引用 <script> window.alert("你好，王先生！"); </script>--> <!--第二种方式，外部引用--> <script src="js/fistjs.js"></script> </head> <body> </body> </html>
2.基本语法入门
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> var score = 71; if (score>=0&&score<=100){ if (score>90&&score<100){ alert("优秀"); }else if (score>80&&score<90) { alert("良好"); }else { alert("及格"); } } </script> </body> </html>
3.数据类型与运算
javascript中的数据包含：数值，文本，图形，音频，视频….
变量
var a = 1;
number
js不区分小数和整数，Number
123//整数 123.1//浮点数 -99//负数 NaN//not a number Infinity//表示无限大
字符串
‘abc’ 、“abc”
布尔值
true、false
逻辑运算符
&& //两个都为真，结果为真 || //一个为真，结果为真 ! //真即假，假即真
比较运算符
= //赋值预算法 == //等于（类型不一致，值一样，也会判断为true 即判断1=='1'） === // 绝对等于（类型一样，值一样，结果为true），这是一个JS的缺陷，要坚持用===进行比较
注意：
NaN，与所有的数值都不相等，包括自己
只能通过isNaN()来判断这个数是不是NaN
浮点数问题
console.log(1/3)===(1-2/3) //结果为false // 尽量避免使用浮点数进行运算，存在精度问题 Math.abs(1/3-(1-2/3))<0.00000001 //结果为true
null和undifined
null：空
undefined：未定义
数组
Java的数组必须是相同类型的对象，JS中不需要这样！
//保证代码的可读性，尽量使用[] var arr = [1,2,3,'hello',null,true]; //取数组下标：如果越界了，就会报undefined
对象
对象是大括号，数组是中括号
每一个属性之间使用逗号隔开，最后一个不需要加逗号
var person = { name: "王先生", age: 18, tags: ['高大','帅气', '才华横溢', '大眼睛'] }
取对象的值
person.name "王先生" person.tags[0] "高大"
4.严格检查格式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!-- 前提：Idea，设置支持ES6语法 'use strict';严格检查模式，预防JavaScript随意性导致产生的一些问题 必须写在script标签内的第一行！ 局部变量建议都使用let去定义 --> <script> 'use strict'; let i = 1; </script> </body> </html>
三、数据类型
1.字符串
正常字符串我们使用单引号或者双引号包裹
注意转义字符 \
\' \n \t \u4e2d \u#### Unicode 字符 \x41 Ascll字符
多行字符串编写
//tab 和ESC键中间的字符`` 包裹 var msg = ` hello world 你好 `
模板字符串
let name = '王先生'; let msg = `你好呀，${name}`;
字符串长度
str.length
字符串不可变
let student = "student"; student[1] = 1; >1 console.log(student) >student
大小写转换
let student = "student"; console.log(student.toUpperCase()); console.log(student.toLowerCase());
元素的索引
sutdent.indexOf(‘t’);
substring
let student = "student"; //左闭右开[0,3)，从第一个字符串取到第二个 stu; console.log(student.substring(0,3));
2.数组
Array可以包含任意的数据类型
var arr = [1,2,3,4,5,6] //通过下标取值和赋值 arr[0] arr[0] = 1;
长度
arr.length // 注意：假如给arr.length赋值，数组的大小就会发生变化，如果赋值过小，元素就会丢失
indexOf：通过元素获得下标索引
arr.indexOf(2); >1 // 注意：字符串的”1”和数字的1是不同的
slice() ：截取Array的一部分，返回一个新的数组，类似于String中的substring
arr.slice(2); //[3, 4, 5] 类似于String中的substring arr.slice(2,4); //[3, 4]
push() ， pop() ：从数组尾部进行添加和删除元素
//push(); 压入到尾部 let arr = [1,2,3,4,5,"6","a"]; arr.push("b"); [1, 2, 3, 4, 5, "6", "a", "b"]; //pop();删除尾部 arr.pop(); [1, 2, 3, 4, 5, "6", "a"];
unshift() ，shift() ：从数组头部进行添加和删除元素
//unshift() 头部增加 let arr = [1, 2, 3, 4, 5]; arr.unshift(0); [0, 1, 2, 3, 4, 5]; //shift(),删除头部 arr.shift(); [1, 2, 3, 4, 5];
sort()：排序
let arr = [6, 2, 8, 4, 5]; arr.sort(); [2, 4, 5, 6, 8];
reverse()：元素反转
let arr = [2, 4, 5, 6, 8]; arr.reverse(); [8, 6, 5, 4, 2];
concat()：拼接
let arr = [8, 6, 5, 4, 2]; arr.concat(['a','b','c']); //返回一个新的数组 [8, 6, 5, 4, 2, "a", "b", "c"]; //并未改变原来的数组arr [8, 6, 5, 4, 2];
join：连接符
// 打印拼接数组，使用特定的字符串连接 let arr = [8, 6, 5, 4, 2]; arr.join("-"); "8-6-5-4-2";
多维数组
let arr = [[1,2], [3,4], ['a','b']]; arr[1][1]; 4;
