JavaScript概述
ECMAScript和JavaScript的关系
ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现。
完整的 JavaScript
- 核心（ECMAScript）
- 文档对象模型（DOM） Document object model (整合js，css，html)
- 浏览器对象模型（BOM） Broswer object model（整合js和浏览器）
JavaScript 是脚本语言
JavaScript是一种轻量级的编程语言。后来出现了node.js，可以作为后端语言来开发项目，js是一个既能做前端又能做后端的语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScript引入方式
Script标签内写代码
在head标签里面可以写，在body标签里面也可以写
<script> // 在这里写你的JS代码 //console.log('骑士计划！') #f12建打开浏览器的调试窗口，然后在console这个调试台就能看到这个内容了 //alert('骑士计划！') #这个是浏览器窗口一打开咱们这个文件，就弹出一个窗口 </script>
引入额外的JS文件
<script src="myscript.js"></script>
JavaScript语言规范
注释（注释是代码之母）
// 这是单行注释 /* 这是 多行注释 */
结束符
JavaScript中的语句要以分号（;）为结束符。
JavaScript语言基础
变量的声明
变量名可以使用数字，字母，下划线，$组成，不能以数字开头。
声明变量使用var 变量名； let 变量名；的格式来进行声明。
注：
let 变量名; 声明变量时，所声明的变量只在let命令所在的代码块内有效。且不可更改
变量名不能用保留字
例：
var a=123 a 123 let b=123 b 123 var b=123 VM267:1 Uncaught SyntaxError: Identifier 'b' has already been declared #提示不能更改，已经被定义 var a=2 #但是a能被更改 a 2
JavaScript数据类型
数值(Number)
JavaScript不区分整数和浮点型，只有一种数字类型
var a=1.11 var b=2 var c=10e2 var d=25e-5 console.log(a,b,c,d) 1.11 2 1000 0.00025 console.log(typeof(a),typeof(b),typeof(c),typeof(d)) #类型 number number number number
字符串转数字(parseInt)
parseInt('123') 123 parseInt('12a3') 12 parseInt('12 3') 12 parseInt('a123') #从上可知当转换时遇到非数字就停止转换，返回当前转换完的值 NaN
字符串(String)
var a='hello' var b='world' var c=a+b #字符串拼接 c "helloworld"
.常用方法：
|
方法 |
说明 |
|
.length |
返回长度；不加括号时是属性 |
|
.trim() |
移除两边的空白，得到一个新值，不更改原有的变量 |
|
.trimLeft() |
移除左边的空白 |
|
.trimRight() |
移除右边的空白 |
|
.charAt(n) |
返回索引为n的字符，超过最大值返回空字符串 |
|
.concat(value) |
拼接 |
|
.indexOf(substring,start) |
查找某内容在字符串中的索引，start为初始查询位置 |
|
.slice(start, end) |
切片 |
|
.toLowerCase() |
全部变小写 |
|
.toUpperCase() |
全部变大写 |
|
.split(delimiter, limit) |
分割，limit为返回切割后的元素个数 |
实例：
var a=' hello world ' a.length 13 b=a.trim() "hello world" a " hello world " b "hello world" c=a.trimLeft() "hello world " c "hello world " a.charAt(2) "e" a.concat('ok') " hello world ok" a.indexOf('l',5) 10 a.slice(1,5) "hell" a.toUpperCase() " HELLO WORLD " a.toLowerCase() " hello world " a.split('l') (4) [" he", "", "o wor", "d "]
布尔值(Boolean)
区别于Python，true和false都是小写。
var a = true;
var b = false;
""(空字符串)、0、null、undefined、NaN都是false。
null和undefined的区别
undefined表示当声明一个变量但未初始化时，该变量的默认值是undefined。还有就是函数无明确的返回值时，返回的也是undefined。
null表示变量的值是空，undefined则表示只声明了变量，但还没有赋值。
对象(Object)
对象只是带有属性和方法的特殊数据类型。
数组
数组对象的作用是：使用单独的变量名来存储一系列的值。类似于Python中的列表。
var a=[123,'ABC']; a (2) [123, "ABC"] a[1] "ABC" a[0] 123
常用方法
|
方法 |
说明 |
|
.length |
数组的大小 |
|
.push(ele) |
尾部追加元素 |
|
.pop() |
删除尾部的元素 |
|
.unshift(ele) |
头部插入元素 |
|
.shift() |
头部移除元素 |
|
.slice(start, end) |
切片 |
|
.reverse() |
反转，在原数组上改的 |
|
.join(seq) |
将数组元素连接成字符串，seq是连接符 |
|
.concat(val, ...) |
连接数组，数个数组合并,得到一个新数组，原数组不变 |
|
.sort() |
排序 |
|
.forEach() |
将数组的每个元素传递给回调函数 |
|
.splice() |
删除元素，并向数组添加新元素 |
|
.map() |
返回一个数组元素调用函数处理后的值的新数组 |
例：
var a=[123,'123','1','2','3'] a (5) [123, "123", "1", "2", "3"] a.length 5 a.push('4') 6 a (6) [123, "123", "1", "2", "3", "4"] a.pop() "4" a (5) [123, "123", "1", "2", "3"] a.unshift('234') 6 a (6) ["234", 123, "123", "1", "2", "3"] a.shift() "234" a (5) [123, "123", "1", "2", "3"] a.slice(0,4) (4) [123, "123", "1", "2"] a (5) [123, "123", "1", "2", "3"] a.reverse() (5) ["3", "2", "1", "123", 123] a (5) ["3", "2", "1", "123", 123] a.join('+') "3+2+1+123+123" a.concat([222]) (6) ["3", "2", "1", "123", 123, 222] a (5) ["3", "2", "1", "123", 123]
关于sort()的注意
如果调用该方法时没有使用参数，将按字母顺序对数组中的元素进行排序，即是按照字符编码的顺序进行排序。
如果想按照其他标准进行排序，就需要提供比较函数，也就是自己提供一个函数提供排序规则，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：
若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0。
若 a 大于 b，则返回一个大于 0 的值。
function sortNumber(a,b){ return a - b } var arr1 = [11, 100, 22, 55, 33, 44] arr1.sort(sortNumber)
内置对象和方法
JavaScript中的所有事物都是对象：字符串、数字、数组、日期，等等。在JavaScript中，对象是拥有属性和方法的数据。
|
类型 |
内置对象 |
介绍 |
|
数据类型 |
Number |
数字对象 |
|
String |
字符串对象 |
|
|
Boolean |
布尔值对象 |
|
|
组合对象 |
Array |
数组对象 |
|
Math |
数学对象 |
|
|
Date |
日期对象 |
|
|
高级对象 |
Object |
自定义对象 |
|
Error |
错误对象 |
|
|
Function |
函数对象 |
|
|
RegExp |
正则表达式对象 |
|
|
Global |
全局对象 |
自定义对象
自定义对象时，key可以不用加引号，取值方式有两种：
- 1. [‘key’] 这种方式时，key要加引号
- 2. .key 通过点取值
JavaScript的对象（Object）本质上是键值对的集合（Hash结构），但是只能用字符串作为键。
var a = {"name": "Alex", "age": 18};
console.log(a.name);
console.log(a["age"]);
或
var a={ name:'alex',age:18 };
运算符
算数运算符
|
+ - * / |
正常的加减乘除 |
|
++ -- |
自加 自减 |
注意：
i++：先执行逻辑，再自加1
++i：先自加1，再执行逻辑
比较运算符
|
正常的大小于 |
|
== === |
弱等于 强等于 |
注意：
1 == “1” // true #弱等于，将1转换为字符串'1',在=号两个数据类型不同的时候，自动转为同一类型。
1 === "1" // false #强等于，连同数据类型一起对比。
逻辑运算符
&& || ! #and，or，非（取反）!null返回true
赋值运算符
= += -= *= /= #n += 1其实就是n = n + 1
流程控制
if-else
if (a>5){ console.log('yes'); }else { console.log('no'); } yes
if-else if-else
var a = 10; if (a > 5){ console.log("a > 5"); }else if (a < 5) { console.log("a < 5"); }else { console.log("a = 5"); }
switch 切换
switch (a){ case 5:console.log('5');break; case 10:console.log('10'); case 15:console.log('15'); } 10 15
切记要加break，不然自动执行之后的代码，不管条件满足与否。
switch (a){ case 5:console.log('5');break; case 10:console.log('10');break; case 15:console.log('15'); } 10
for
for (var i=0;i<10;i++) { console.log(i); }
while
var i = 0; while (i < 10) { console.log(i); i++; }
三元运算
var a = 1; var b = 2; var c = a > b ? a : b
函数
创建函数
定义函数：
function sum(a, b){ return a + b; } sum(1, 2);
函数自动执行：
(function(a, b){ return a + b; })(1, 2);
匿名函数：
var f = v => v;
函数的全局变量和局部变量
变量生存周期
JavaScript变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。
创建对象
创建对象时，命名的首字母要大写，实例化的时候使用new关键字进行实例化。
Date对象
方法1：不指定参数
var d1 = new Date(); //获取当前时间
console.log(d1.toLocaleString()); //当前时间日期的字符串表示
方法2：参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12"); #月/日/年(可以写成04/03/2020)
console.log(d3.toLocaleString());
方法3：参数为毫秒数，了解一下就行
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());
方法4：参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString()); //毫秒并不直接显示
JSON对象
var str1 = '{"name": "chao", "age": 18}';
var obj1 = {"name": "chao", "age": 18};
JSON字符串转换成对象
var obj = JSON.parse(str1);
对象转换成JSON字符串
var str = JSON.stringify(obj1);