JavaScript详细知识点总结1

js基础

Javascript是一门面向对象的，跨平台的脚本语言

变量

声明

变量命名见名知义，驼峰命名，不要跟关键字冲突

var str = 'hello'
var userName = 'zhangsan'

类型

js本身是弱类型，但是计算机内部还是会区分每一种数据类型

五（六）种基本数据类型：number、string、boolean、undefined、null、（symbol）

两种引用类型：object、function

一个关键字 typeof typeof返回有六种值： number、string、boolean、undefined、object、function

类型转换

隐式转换（+、-、*、/、%、==）

显式转换（parseInt()、parseFloat()、Number()、toString()、String()、toFixed()）

NaN : Not a Number

isNaN(num)函数，该函数判断num变量的值是否是NaN，是NaN返回true，数字返回false

NaN跟任何数字去运算结果都是NaN

运算符

算数运算符

加、减、乘、除、求余/取模（+ 、- 、* 、/ 、%）

+=、-=、*=、/=、%=

++、-- 以及自增自减的前置（先算后用）后置（先用后算）

关系运算符

（相等）、=（全等）、!=（不等于）、<（小于）、>（大于）、<=（小于或者等于）、>=（大于或者等于）

逻辑运算符

&&（与）、||（或）、！（非）

逻辑短路

当第一个表达式已经能够决定整个表达式的结果了，第二个就不参与了

进制（了解）

分支

根据不同的条件判断来决定程序执行走向的结构（也叫选择结构）

if

if(true){
    
    
    //会执行的语句
}

if(false){
    
    
    //会跳过不执行的语句
}

if(判断条件){
    
     //当if括号中结果为true时执行语句1，否则执行语句2
    //语句1
}else{
    
    
    //语句2
}

if(判断条件1){
    
     //当条件1结果为true时执行语句1
    //语句1
}else if(判断条件2){
    
     //当条件1结果为false而且条件2结果为true时执行语句2
    //语句2
}else{
    
     //当条件1条件2结果都为false时执行语句3
    //语句3
}

注意：0、-0、null、""、false、undefined 或者 NaN在if条件里结果为false

switch case 多分支语句

switch(语句){
    
      //语句的结果与每一条case内容进行匹配
    case 1:
       alert(1);
	break;
	case 2:
		alert(2);
	break;
	case 3:
		alert(3);
	break;
	default:
		alert(0);
}

注意switch的应用场景（有多个确定值需要判断的时候）；

case是全等匹配；

注意case穿透，要加break语句（如果程序没有发现break语句，那么解析器会继续向下解析）;

循环

需要重复执行同一操作的程序结构称为循环结构。

while

while(条件){
    
    
    //条件成立就会反复执行这里的代码
}

do…while循环

do {
    
    
    //先执行一遍代码  //while条件成立再继续反复执行
} while (条件)

for

for (var i = 0; i < 10; i++) {
    
    
    console.log(i);
}

三种循环的联系和区别

都是会反复执行的代码块
大部分情况下可以互相替换
do…while至少执行一次，while和for有可能0次，while不太能确定执行次数，for绝大部分情况下都可以确定

函数

一个工具，被封装好可重复执行的一段代码块

function test () {
    
    
    
}
var test1 = function () {
    
    
    
}
test()
test1()

参数

形参：形式参数，声明函数的时候写在小括号里面的参数，无需var

实参：实际参数，在函数调用的时候需要传递实际有值得参数实参个数大于形参，多余实参自动舍弃形参个数大于实参，多余形参默认为undefined

实参副本arguments：可以在函数内部使用arguments接收所传递过来的参数，是一个类数组对象

作用域：变量的作用范围

全局变量

作用范围为整个程序的执行范围在函数体外部定义的变量就是全局变量在函数体内部不使用var定义的也是全局变量

局部变量

作用范围是某个函数体内部在函数体内部通过var关键字定义的变量或者形参，都是局部变量当局部变量与全局变量重名时，在函数体内部局部变量优先于全局变量

return关键字

结束函数的执行
交回函数执行权
返回一个结果函数调用位置（如果不写返回值默认返回值是undefined）

数据结构

栈：先进后出（FILO），在栈顶做插入（压栈）和删除操作（出栈）
队列：先进先出（FIFO），在队头做删除操作,在队尾做插入操作
堆和它们不同，代码执行时系统动态分配，不存在是先进后出还是先进先出

执行环境栈

变量生命周期

作用域链

递归

程序调用自身的编程技巧称为递归（ recursion）。

递归就是在运行的过程中调用自己，本质就是循环。

构成递归需具备的条件

子问题须与原始问题为同样的事，且更为简单
不能无限制地调用本身，须有个出口，化简为非递归状况处理。

由于递归是函数本身一层一层压栈，导致先入栈的不能出栈，空间占满以后就会造成堆栈溢出

匿名函数：没有名字的函数

自调用函数（IIFE）

Immediately Invoked Function Expression （立即调用函数表达式）

JS运行和编译

语法分析

查找基本语法有没有错误预解析
执行之前进行预解析（变量提升）

var、function关键字提前到当前作用域的顶部，变量默认值为undefined，函数默认值为函数体代码块，当函数与变量重名时，保留函数。
解释执行

对象

类是对象的抽象，对象是类的实例

js中对象的本质：属性和方法的集合

对象遍历：for…in循环（隐式迭代）

var obj= new Object();
obj.name = "zhangsan";
obj.age = 18;
obj["gender"] = "male";
for(var key in obj){
    
    
    console.log(key);
    console.log(obj[key]);
}

数组

数组：一组数据（一个变量来承载）

数组的长度 arr.length

数组的索引（下标） arr[0] ~ arr[arr.length-1]

数组遍历

for循环：使用最多的一种循环
for…in（ES5）遍历稀疏数组的时候不会遍历到undefined
for…of（ES6）遍历直接得到值，得不到下标

引用类型

基本数据类型：number、string、boolean、undefined、null

引用数据类型：object（array也属于object）、function

函数的值传递和引用传递

基本类型作为参数传递的是值，而引用类型作为参数传递的是引用，即地址

数组API

方法	描述
concat	连接两个或更多的数组，并返回结果
join	把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔
pop	删除并返回数组的最后一个元素
push	向数组的末尾添加一个或更多元素，并返回新的长度
shift	删除并返回数组的第一个元素
unshift	向数组的开头添加一个或更多元素，并返回新的长度
reverse	颠倒数组中元素的顺序
slice	从某个已有的数组返回选定的元素
splice	删除元素，并向数组添加新元素
toString	把数组转换为字符串，并返回结果
sort	对数组的元素进行排序

sort是按ASCII码来排序的，如果想按数字大小排，可以使用

arr.sort(function (a, b) {
    
    
    // 指定规则
    // a和b是sort方法会依次去取数组里的元素
    // 如果这里的返回值大于0，那么a和b就会交换顺序，不大于0就不交换
    // return a - b // 升序
    return b - a // 降序
})

ES5新增数组常见方法

2个索引方法：indexOf() 和 lastIndexOf()
5个迭代方法：forEach()、map()、filter()、some()、every()
2个归并方法：reduce()、reduceRight()

排序

冒泡排序

for (var i = 0; i < arr.length - 1; i++) {
    
    
    for (var j = 0; j < arr.length - i - 1; j++) {
    
    
        if (arr[j] > arr[j+1]) {
    
    
            var temp = arr[j]
            arr[j] = arr[j+1]
            arr[j+1] = temp
        }
    }
}

选择排序

for (var i = 0; i < arr.length - 1; i++) {
    
    
    var min = i
    for (var j = i + 1; j < arr.length; j++) {
    
    
        if (arr[min] > arr[j]) {
    
    
            min = j
        }
    }
    if (i != min) {
    
    
        var temp = arr[i]
        arr[i] = arr[min]
        arr[min] = temp
    }
}

另：插入排序、快速排序（了解思路）

去重

双重for循环，只留下不重复的
利用对象属性名不冲突
ES6（Set是一种新的数据类型，加强版数组，默认不允许重复）

字符串

ASCII码

计算机最通用的编码标准，使用 7 位二进制数来表示所有的大写和小写字母，数字 0 到 9、标点符号，以及在美式英语中使用的特殊控制字符。

字符串API

方法	描述
charAt	返回在指定位置的字符
indexOf	检索字符串，返回下标
lastIndexOf	从后向前搜索字符串
charCodeAt	返回在指定的位置的字符的编码
fromCharCode	从字符编码创建一个字符串
concat	连接字符串
slice	提取字符串的片断，并在新的字符串中返回被提取的部分
split	把字符串分割为字符串数组
toLowerCase	把字符串转换为小写
toUpperCase	把字符串转换为大写
trim	去掉字符串前后空格（ES5）
replace	替换与正则表达式匹配的子串
match	找到一个或多个（正则表达式的）匹配
search	检索与正则表达式相匹配的值
substr	从起始索引号提取字符串中指定数目的字符（不推荐）
substring	提取字符串中两个指定的索引号之间的字符（不推荐）
startsWith	字符串是否以某个字符开头（ES6）
endsWith	字符串是否以某个字符结尾（ES6）
includes	字符串是否包含某个字符（ES6）
repeat	重复某个字符串几次（ES6）

内置对象

js内置的可以直接使用的对象

Number
String
Boolean
Array
Object
Function
RegExp
Error
Math
Date

Math

数学对象，关于数学运算的属性和方法

Math.PI // Math对象里的属性都是常量，不能被修改

Math.floor()

Math.ceil()

Math.round()

Math.pow()

Math.sqrt()

Math.abs()

Math.random()

生成一个min~max的随机数

Math.random() * (max - min) + min

Date

获取系统时间以及对日期做一些操作

获取当前日期 new Date()

时间戳：从1970年到当前日期对象总的毫秒数

获取系列API

getFullYear()

getMonth() 0~11

getDate()

getDay() 0~6星期

getHours()

getMinutes()

getSeconds()

getTime() 获取时间戳

设置系列API

获取用get系列，设置换成set即可，但是day星期几不能设置

如果设置传了超过正常日期的参数，会自动计算

转换字符串

toLocaleString() 转换为当地字符串

toUTCString() 转换为标准时区字符串