一.JavaScript概述
一个完整的 JavaScript 实现是由以下 3 个不同部分组成的:
- 核心(ECMAScript)
- 文档对象模型(DOM) Document object model (整合js,css,html)
- 浏览器对象模型(BOM) Broswer object model(整合js和浏览器)
简单地说,ECMAScript 描述了JavaScript语言本身的相关内容。
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 很容易学习。
二.JavaScript的引入方式
Script标签内写代码
<script> // 在这里写你的JS代码 </script>
引入额外的JS文件
<script src="myscript.js"></script>
三 .JavaScript语言规范
注释
// 这是单行注释
/*
这是
多行注释
*/
结束符
JavaScript中的语句要以分号(;)为结束符。
四.JavaScript语言基础
1.var 声明变量 :
命名规则:不能以数字开头,可以用下划线,$,数字,字母
变量名区分大小写
var age = 18 ; var sex = "男" ;
const 声明常量.一旦声明,值不可变
const PI = 3.1415 ; PI // 3.1415 PI = 3 // 报错 TypeError: "PI" is read-only
五.JavaScript数据类型
1.数字(Number)
JavaScript不区分整型和浮点型,就只有一种数字类型。
var a = 3.14 ; var b = 3 ; var c = 3e2 ; // 300 var d = 3e-2 ; // 0.03
// 还有一种NaN,表示不是一个数字(Not a Number
常用方法 :
// 字符串类型转 Number类型 parseInt('123') ; // 返回123 parseInt("abc") ; // 返回NaN ,NaN属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。 parseInt('1.11') ; // 返回1.11
2.字符串(String)
var s1 = 'hello' ; var s2 = 'world' ; var s = s1+s2 ; console.log(s)
常用方法:
var s1 = 'hello' ; var s2 = 'world'; var s = s1+s2 ; console.log(s.length)
.trim() 移除空白
.trimLeft() 移除左边的空白
.trimRight() 移除右边的空白
var a = ' Hello World '; console.log(a.trim()) ; //去除左右两边,不去中间 console.log(a.trimLeft()) ; //去除左边 console.log(a.trimRight()) ; //去除右边
.charAt(n) 返回第N个字符
var a = ' Hello World '; console.log(a.charAt(3));
.indexOf(substring, start) 子序列位置
var a = ' Hello World '; console.log(a.indexOf('ll')); //查看某个字符或字符组在字符串中出现的位置(索引)
.substring(from, to) 根据索引获取子序列
var a = ' Hello World '; console.log(a.substring(5,6))
console.log(a.substring(5,3))
// 字符串中索引为五的元素,n,m开始到结束位置,顾头不顾尾 console.log(a.substring(5)) // 索引5开始,一直到最后 console.log(a.substring(5,8)) // 索引5-8
.slice(start, end) 切片.此方法比上面的.substring()更好用
可以负数倒着取,substring不可以
var a = ' Hello World '; console.log(a.slice(3,-1)); console.log(a.slice(-5,-1));

两者的相同点: 如果start等于end,返回空字符串 如果stop参数省略,则取到字符串末 如果某个参数超过string的长度,这个参数会被替换为string的长度 substirng()的特点: 如果 start > stop ,start和stop将被交换 如果参数是负数或者不是数字,将会被0替换 silce()的特点: 如果 start > stop 不会交换两者 如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符) 如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)
.toLowerCase() 小写
.toUpperCase() 大写
var a = ' Hello World '; console.log(a.toLowerCase()); console.log(a.toUpperCase());
.split() 切割,得到列表
var a = ' Hello World '; console.log(a.split(' '));

//像python的格式化输出 var name = "q1mi", time = "today"; `Hello ${name}, how are you ${time}?`
3.Boolean(布尔值)
区别于Python,true和false都是小写。
""(空字符串)、0、null、undefined、NaN都是false。
var a = true; var b = false;
4. null 和 undefined
null :表示值是空,一般在需要指定或清空一个变量时才会使用,如 name=null;
undefined : 声明未定义
var x; // 此时x是undefined
null表示变量的值是空,undefined则表示只声明了变量,但还没有赋值。
5.对象(Object)
JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...此外,JavaScript 允许
自定义对象。
JavaScript 提供多个内建对象,比如 String、Date、Array 等等。
对象只是带有属性和方法的特殊数据类型。
数组 : 使用单独的变量名来存储一系列的值。类似于Python中的列表。
var a = [123, "ABC"]; console.log(a[1]); // 输出"ABC"
常用方法:
.length 数组大小(长度)
.slice(start, end) 切片
.push(ele) 尾部追加元素
var lst = [11,'abc',22,'33',55]; lst.push(66); console.log(lst);
.pop() 获取尾部元素
var lst = [11,'abc',22,'33',55]; console.log(lst.pop());
.unshift(ele) 头部插入元素
.shift() 头部移除元素
var lst = [11,'abc',22,'33',55]; lst.unshift(0); console.log(lst);
lst.shift();
console.log(lst);
.reverse() 反转
var lst = [11,'abc',22,'33',55]; lst.reverse(); console.log(lst);
.join(seq) 将数组元素连接成字符串
.concat(val, ...) 连接数组 把元素追加到后面
var lst = [11,'abc',22,'33',55]; console.log(lst.join("__"))
console.log(lst.concat('__',"aaa"));
.sort() 排序
var num = [55,22,44,88,2,3]; console.log(num.sort()); //结果 [2, 22, 3, 44, 55, 88] var s = ['e','w','a','p','l']; console.log(s.sort()); // 按unicode编码顺序排位

/*关于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)
.splice() 删除元素,并向数组添加新元素.
splice(index,howmany,item1,.....,itemX)
index (必须):从什么位置开始删 howmany(必须):删除多少 items(可选):要添加的元素
// 从哪里开始删除就从哪开始添加
var lst = [11,'abc',22,'33',55]; lst.splice(1,2,'ABC',22222,33333); console.log(lst) // 结果:[11, "ABC", 22222, 33333, "33", 55]
.map() 返回一个数组元素调用函数处理后的值的新数组
.forEach() 将数组的每个元素传递给回调函数
forEach(function(currentValue, index, arr), thisValue)
map(function(currentValue,index,arr), thisValue)
function(必须) :函数,数组中每个元素都会执行这个函数
currentValue (必须):当前元素的值
index (可选):当前索引 arr(可选) : 当前元素属于的数组对象
thisValue (可选): 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"
var lst = [11,'abc',22,'33',55]; console.log( lst); console.log(typeof"abc") ; // "string" console.log(typeof null) ; // "object" console.log(typeof true) ; // "boolean" console.log(typeof 123) ; // "number"
typeof是一个一元运算符(就像++,--,!,- 等一元运算符),不是一个函数,也不是一个语句。
六.运算符
1.算数运算符
+ - * / % ++ --
2.比较运算符
> , >= , < , <= , != ,== , === , !==
1 == “1” // true
1 === "1" // false //判断类型和值是否都相等
3.逻辑运算符
&& || !
1&&0 // 0 1 || 0 // 1 ! 0 // true ! 1 // false
4.赋值运算符
= += -= *= /=
七.流程控制
1. if else
var a = 10; if (a > 5){ console.log("yes"); } else { console.log("no"); }
2. 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"); }
3.switch
var c= 3 ; switch (c) { case 1: console.log('这是1'); break; case 2: console.log('这是2'); break; case 3: console.log('这是3'); break; default: console.log('都不是') }
switch中的case子句通常都会加break语句,否则程序会继续执行后续case中的语句。
4.for
for (var i=0;i<10;i++) { console.log(i); }
5.while
var i = 0; while (i < 10) { console.log(i); i++; }
6.三元运算符
var a = 1; var b = 2; var c = a > b ? a : b