是什么
- 一门脚本语言
- 一门解释型语言
- 动态类型语言
- 基于对象的语言
- 弱类型语言
使用场景
- 网页特效
- 服务端开发
- 命令行工具
- 桌面程序
- APP
- 控制硬件——物联网
- 游戏开发
区别
-
HTML
标记语言，展示数据
-
CSS
美化页面
-
JavaScript
动态效果，与用户的交互
组成
变量
作用
储存数据或操作数据
声明与初始化
声明
var num （此时没有赋值）
初始化
var num = 10 （此时赋值）
方式：
var 变量名字
注意：
-
以下说法一个意思：
声明变量并初始化 变量的初始化 声明变量赋值 -
可以一次初始化多个值
var num1 = 10, num2 = 20, num3 = 30
命名规范
- 区分大小写
- 第一个字符必须是字母、下划线、或者 $
- 后面的字符可以是数字、字母、下划线、$
- 变量的名字要有意义
- 一般都是小写，并采用驼峰式
- 不能使用关键字
- 字符串可用单引号也可用双引号
交换变量小案例
思路一：使用第三方变量
思路二：一般适用于数字交换（计算方式）
注释
单行注释：// 一般用在一行代码上
多行注释：/**/ 一般用在函数或者一段代码上
数据类型
原始数据类型
number（数字类型：整数和小数）
string（字符串类型）
boolean （布尔类型）
-
null （空类型）
值只有一个：null，一个对象指向为空
-
undefined （未定义）
值只有一个：undefined，
如果声明了变量但是没有赋值的情况下就会是undefined
object （对象）
获取变量的数据类型
typeof 变量名
-
typeof(变量名)
var num = 10 console.log(typeof(num)) console.log(typeof num)
数字类型
整数和小数
JS中可以表示
八进制：0开头
十进制
十六进制：0x开头
数字类型有范围
最大值 Number.MAX_VALUE
最小值 Number.MIN_VALUE
数值判断
NaN:not a number
isNaN:is not a number
注意
不要用小数去验证小数
不要用NaN验证是不是NaN （使用isNaN()）
字符串类型
获取字符串长度：
- .length（包括空格）
JS中的转义符：
| 转义序列 | 字符 |
|---|---|
| \b | 退格 |
| \f | 走纸换页 |
| \n | 换行 |
| \r | 回车 |
| \t | 横向跳格 (Ctrl-I) |
| ' | 单引号 |
| " | 双引号 |
| \ | 反斜杠 |
字符串拼接
使用‘+’号，将多个字符串拼为一个
一个字符串和其他数字拼接，最终结果是字符串
数字类型的字符串和一个数字类型的数字相加得到的是数字类型的数字（发生了隐式转换）
布尔类型
只有两个值，true & false
类型转换
其他类型转数字类型
- parseInt() 转整数
- parseFloat() 转小数
- Number() 转数字 （包括整数和小数）
其他类型转字符串类型
.toString() 变量有意义
-
String() 变量没有意义
var num = 10 console.log(num.toString()) console.log(String(num))
其他类型转布尔类型
Boolean()
console.log(Boolean(1)) // true
console.log(Boolean(0)) //false
操作符
含义：一些符号，用来计算
算数运算符
-
-
-
- /
- %
一元运算符
这个操作符只需要一个操作数就可以运算的符号
-
++
-
前++ 前--
先参与运算，运算结束后再加1
num++ +10num的值为10 -
后++ 后--
自身先加1，然后再参与运算
++num +10num的值为11
-
--
二元运算符
类似于算数运算符
需要两个操作数才能运算
三元运算符
表达式1 > 表达式2 ？表达式3 ：表达式4
符合运算符
由复合运算符连接起来的表达式
- +=
- -=
- *=
- /=
- %=
关系运算符
结果是布尔类型
- ">"
- "<"
- ">="
- "<="
- "=="（不严格）（数据类型不用一致）
- "==="（严格）（数据类型必须一致）
- "!="
- "!=="
逻辑运算符
结果是布尔类型
- &&（并且）
- ||（或者）
- ！（非）
赋值运算符
=
字面量
把一个值直接赋值给一个变量
变量的初始化就是以字面量的方式赋值
var num = 10
var flag = true
var str = 'haha'
//以上方式都叫字面量
流程控制
- 顺序结构
- 分支结构
- if
- if-else
- if-else if-else.......（最后的else可以不用写）（一般是范围的判断）
- switch-case（default后面的break可以省略）（一般是值得判断）
- 三元表达式
- 两个分支，最终的结果是其中之一
- 运算符号： ？ ：
- 大多数情况，使用if-else的语句都可以使用三元表达式
- 循环结构
- while （先判断后循环，可能一次循环都没有）
- do-while（先循环一次，再判断，最少有一次循环）
- for
- for-in
关键字
break
如果在循环中使用，遇到了break，则立刻跳出当前所在循环
continue
在循环中如果遇到了continue关键字，直接开始下一次循环
数组
概念、作用
- 一组有序的数据
- 可以一次性存储多个数据
创建方式
- 构造函数
- var 数组名 = new Array() //空数组
- 数组的名字如果直接输出,那么直接就可以把数组中的数据显示出来,如果没有数据,就看不到数据
- 如果数组中没有数据,但是有长度---,数组中的每个值就是undefined
- 构造函数的方式创建数组的时候,如果在Array(一个数字)--->数组的长度(数组元素的个数) var num = new Arrey(5) //表示这个数组的长度为5，有5个元素，每个数据是undefined
- 如果在Array(多个值);这个数组中就有数据了,数组的长度就是这些数据的个数
- 字面量
- var 数组名 = [] //空数组
- 无论是构造函数的方式还是字面量的方式,定义的数组,如果有长度,那么默认是undefined
数组元素
数组中存储的每个数据,都可以叫数组的元素,比如:存储了3个数据,数组中3个元素
数组长度
就是数组的元素的个数,比如有3个元素,就说,这个数组的长度是3
数组索引（下标）
数组索引(下标):用来存储或者访问数组中的数据的,索引从0开始,到长度减1结束
数组的索引和数组的长度的关系
数组长度减1就是最大的索引值
设置数组中某个位置的值
arr[3] = 100 //arr数组中索引为3的位置值为100
获取数组中某个位置的值
var result = arr[3];
console.log(result)
数组中储存的类型可以不一样
- 例1.数组的函数调用
var arr = [
function () {
console.log("eat")
},
function () {
console.log("sleep")
},
function () {
console.log("play")
},
function () {
console.log("drink")
},
];
arr.forEach(function (ele) {
ele();
})
冒泡排序
把所有的数据按照一定的顺序进行排列（从小到大，从大到小）
函数
把一坨重复的代码封装，在需要的时候直接调用即可
作用：代码重复调用
定义：function 函数名字（） {
函数体
}
调用：函数名（）
注意：
- 函数需要先定义，然后才能使用
- 函数的名字：要遵循驼峰命名法
- 函数一旦重名，后面的会把前面的覆盖
- 一个函数最好就是只有一个功能
函数参数
- 在函数定义的时候,函数名字后面的小括号里的变量就是参数,目的是函数在调用的时候,对用户传进来的值操作，此时函数定义的时候后面的小括号里的变量叫参数;写了两个变量,就有两个参数,
- 在函数调用的时候,按照提示的方式,给变量赋值--->就叫传值,这个值就传到了变量(参数)中
- 形参:函数在定义的时候小括号里的变量叫形参
- 实参:函数在调用的时候小括号里传入的值叫实参,实参可以是变量也可以是值
函数的返回值
- 在函数内部有return关键字,并且在关键字后面有内容,这个内容被返回了
- 当函数调用之后,需要这个返回值,那么就定义变量接收,即可
- 如果一个函数中有return，那么这个函数就有返回值，如果一个函数中没有return,那么这个函数就没有返回值
- 如果一个函数中没有明确的返回值,那么调用的时候接收了,结果就是undefined
- 没有明确返回值:
- 函数中没有return
- 函数中有return,但是return后面没有任何内容
- 没有明确返回值:
- 形参的个数和实参的个数可以不一致
- return 下面的代码是不会执行的
arguments对象
定义一个函数，如果不确定用户是否传入了参数，或者说不知道用户传入了几个参数，没办法计算
但是，如果在函数中知道了参数的个数，也知道了每个参数的值，就可以计算，怎么办呢？
使用arguments对象，可以获取传入的每个参数的值
arguments对象也可以叫做伪数组
函数的命名方式
- 命名函数
- 函数有名字
- 匿名函数
- 函数没有名字
函数的定义
-
声明函数——函数定义
function 函数名 （）｛｝
-
函数表达式
-
把一个函数给一个变量
var f1 = function(){} 如果是函数表达式，那么前面的变量中存储的就是一个函数，而这个变量就相当于是一个函数，就可以直接加小括号用
注意：函数表达式，赋值结束后，要加分号
注意：函数声明如果放在if-else的语句中,在IE8的浏览器中会出现问题，以后宁愿用函数表达式,都不用函数声明
-
if(true){
function f1() {
console.log("哈哈,我又变帅了");
}
}else{
function f1() {
console.log("小苏好猥琐");
}
}
f1();//在IE8中输出`小苏好猥琐`
var ff;
if(true){
ff=function () {
console.log("哈哈,我又变帅了");
};
}else{
ff=function () {
console.log("小苏好猥琐");
};
}
ff();
-
函数自调用
- 没有名字，直接调用，一次性
函数也是一种数据类型
可以通过typeof查看
数据类型是 function
函数作为参数使用
函数可以作为参数使用，如果一个函数作为参数，那么我们说这个参数（函数）叫回调函数
只要是看到了一个函数作为参数使用了，那就是回调函数
函数作为返回值使用
function f1() {
console.log("this is a function ");
return function () {
console.log("this is another function");
}
}
var ff = f1(); // "this is a function "
ff() // "this is another function"
函数的作用域
- 全局变量
- 声明的变量使用var声明的
- 全局变量可以在页面的任何位置使用
- 除了函数以外，其他任何位置定义的变量都是全局变量
- 如果页面不关闭，那么就不会释放，就会占空间，消耗内存
- 局部变量
- 在函数内部定义的变量
- 隐式全局变量：
- 声明的变量没有var
- 可以被删除（全局变量则不可以）delete
- 全局作用域
- 全局变量的使用范围
- 局部作用域
- 局部变量的使用范围
- 块级作用域
- 一对大括号就可以看成是一块，在这块区域中应以的变量，只能在这个区域中使用，但是在js中在这个块级作用域中定义的变量，外面也能使用
- js没有块级作用域
预解析
提前解析代码
- 把变量的声明提前
- 把函数的声明提前
- -提前到当前所在作用域的最上面
- 注意：变量的提升，只会在当前的作用域中提升，函数中的变量只能提升到当前作用域的最前面，不会出去
- 预解析会分段（多对