JS基础

软件：可以实现一定的功能，一到多个程序组成。

程序：代码。

数据结构：存储数据的方式。

算法：解决问题的方法和步骤。

含义：1.解决问题的方法和步骤。2.不是目的，而是过程。3.符合开发思维（业务逻辑）

特点：1.有效性 2.有穷性：解决问题的步骤是有限的，不能无限循环。3.确定性：在需要判断的时候，需要告知计算机，满足做什么，不满足做什么。注：不能给模糊的值。4.0到多个输入。5.1到多个输入

扩展内容

面向过程

面向对象

解释性语言：解释一行执行一行

JS，PHP

编译性语言：整体翻译，再执行

程序设计步骤

1.软件计划

2.需求分析设计

3.软件设计（数据结构，算法）

4.软件开发

5.软件测试

6.运营维护

错误

1.语法错误：没有按照书写格式的规范进行书写。

2.逻辑错误：语法正确时，但是执行时的时候得到的结果与需求不一致。

3.运行错误：语法和逻辑都是正确的，但是在代码运行时发生错误。

 

软件：可以实现一定的功能，一到多个程序组成。

程序：代码。

数据结构：存储数据的方式。

算法：解决问题的方法和步骤。

含义：1.解决问题的方法和步骤。2.不是目的，而是过程。3.符合开发思维（业务逻辑）

特点：1.有效性 2.有穷性：解决问题的步骤是有限的，不能无限循环。3.确定性：在需要判断的时候，需要告知计算机，满足做什么，不满足做什么。注：不能给模糊的值。4.0到多个输入。5.1到多个输入

扩展内容

面向过程

面向对象

解释性语言：解释一行执行一行

JS，PHP

编译性语言：整体翻译，再执行

程序设计步骤

1.软件计划

2.需求分析设计

3.软件设计（数据结构，算法）

4.软件开发

5.软件测试

6.运营维护

错误

1.语法错误：没有按照书写格式的规范进行书写。

2.逻辑错误：语法正确时，但是执行时的时候得到的结果与需求不一致。

3.运行错误：语法和逻辑都是正确的，但是在代码运行时发生错误。

 

数据类型转换

1.强制转换

书写格式：数据类型（变量名）

2.隐式转换

算术运算符 会把运算符左右的变量转换成数值类型，注：加号的左右存在字符串，则进行拼接

判断条件转换成Boolean

1.0

2.空字符串‘’ “” ``

3.Null

4.undifined

5.false

6.NaN

运算符

1.赋值运算符 =

书写格式：标识符=值或表达式

 

2.一元运算符 ++递加 --递减

++在前面，先递加，再使用；++在后面，先使用，后递加

--同上

例子：

let num=123;

console.log(++num); 124

console.log(num++); 124

console.log(num); 125

3.逻辑运算符

！非：取反

&& 与：一假全假

工作原理：A&&B

判断A是true，则返回B，反之返回A

｜｜或：一真全真

工作原理：A｜｜B

判断A是true，则返回A，反之返回B

4.三目运算符

书写格式：条件？表达式1:表达式2

功能：条件为true，执行表达式1

条件为false，执行表达式2

5.解构运算符

注：赋值符号的左右数据类型一致

例子：左右都是数组，左右都是对象

例子：

let i=1;

let j=2;

[i,j]=[j,i]

console.log(i,j);//2 1

 

 

 

数组

一个变量，可以存储多个数据，并且数据的类型可以不同。

数组的遍历：

for(let i=0;i<3;i++){

console.log(arr[i]);

}

遍历数组中的每个值：

for(let items of arr){

console.log(itmes);

}

遍历数组中的每个下标：

for(let index in arr){

console.log(index,arr(index));

}

数组的方法：增，删，改，查

增

push

书写格式：数组名.push(添加的内容)

注：内容可以是多个数据，分隔符逗号

功能：在数组后面添加数据

例子：

let arr=[`a`,`b`,`c`,`d`,`e`]

arr.push(true)

console.log(arr);

unshift

书写格式：数组名.unshift(添加的内容)

注：内容可以是多个数据，分隔符逗号

功能：在数组前面添加数据

例子：

let arr = [`a`, `b`, `c`, `d`, `e`]

arr.unshift(null,undefined);

console.log(arr);

删

pop

书写格式：数组名.pop()

功能：删除数组最后一个数据

例子：

let arr = [`a`, `b`, `c`, `d`, `e`]

arr.pop();

console.log(arr);

shift

书写格式：数组名.shift()

功能：删除数组最后第一个数据

例子：

let arr = [`a`, `b`, `c`, `d`, `e`]

arr.shift();

console.log(arr);

slice

特点：

1.不会改变原数组

2.返回参数对应的数据

工作原理：

一个参数：

这个参数就是获取数组数据的起始下标，则返回这个参数起始下标到数组最后一个数据

两个参数：

参数1获取数组数据的起始下标，即数组的下标

参数2获取数组数据的结束下标，即数组的下标

功能：返回参数1到参数2的数据，不包括参数2下标的数据

注：1.如果参数出现负值，则数组长度与其相加

2.如果下标的数据不存在，则返回空数组[]

splice(删除，修改，插入）

注：没有满足的条件返回空数组

【删除】

一个参数：

代表从这个参数作为下标取值到数组最后一个数据。

两个参数：

参数1代表起始下标

参数2代表获取数据的个数

【修改】

给三个参数

参数1起始下标

参数2修改的个数

参数3及以后的参数都是修改后的数据

【插入】

给三个参数

1.参数1起始下标

2.参数2为0

3.参数3及以后的参数都是插入参数1前的数据

查找

indexOf

工作原理：从第一个值开始查找，返回与查找内容相等的数据下标，如果没找到返回-1

书写格式：数组名.indexOf(查找内容)

lastIndexOf

工作原理：从最后一个值开始查找，返回与查找内容相等的数据下标，如果没找到返回-1

书写格式：数组名.lastIndexOf(查找内容)

返回数组中是否存在要查找的数据

数组名.include(查找的内容)

数组的concat方法

书写格式：数组1.concat（数组2）

返回两个数组的数据

数组的属性：

获取数组的长度（数据个数）数组名：length

console.log(arr.length);

数组最后一个下标 arr.length-1

创建数组的方式：

1.字面量方式1

书写格式

关键字 标识符 赋值符号 中括号 分号

let arr = [ ] ;

中括号里每个数据之间的分隔符是逗号

每个数据成为元素

例子：

let account=["f72","123",666,false]

每个元素都有自己在数组中的唯一索引（下标）

我们可以通过索引（下标）来获取数据

注：下标的起始取值是0

访问一个数组不存在的下标，输出的值是undefined

2.构造函数

书写格式：

关键字 标识符 赋值符号 new Array（） ；

例子：

let arr = new Array（）

 

字面量与构造函数的区别：

字面量创建的数组，解析速度更快。

原因：

1.字面量属于JSON格式，JS引擎可以直接解析

2.构造函数就需要先调用构造函数，再进行JS引擎解析。

数组与字符串的相互转换

书写格式：字符串.split(分隔符)

例子：

let str=`123`;

let arr=str.split(``)

console.log(arr);//[ '1', '2', '3' ]

数组与数值的相互转换

书写格式：字符串.join(分隔符)

例子：

let arr=[2020,12,15]

let str=arr.join(`-`)

console.log(str);//2020-12-15

集合

可以存储多个数据，数据不重复（全等匹配）

声明集合（创建集合）

let set=newSet();

集合的方法

增加

add添加数据（链式调用）

注：add回返回添加后的新集合

例子：

set.add(2).add(3).add(4).add(true);

删除

书写格式：集合名.delete(删除的内容）

例子：

let set=new Set();

set.add(2).add(3).add(4).add(true);

set.delete(true);

console.log(set);//Set(3) { 2, 3, 4 }

查找

书写格式：集合名.has(查找内容)，返回Boolean

例子：

let set=new Set();

set.add(2).add(3).add(4).add(true);

set.delete(2);

console.log(set.has(2));//false

console.log(set.has(3));//true

集合的属性

set.size 集合的长度

数组与集合的转换

数组转集合

例子：

let arr=[`A`,`B`,`C`];

let set=new Set(arr);

console.log(set);

集合转数组：

例子：

let arr=[`A`,`B`,`C`];

let set=new Set(arr);

arr=[...set];

console.log(arr);

 

清空集合

set.clear();

 

函数

具有一定功能,封装成函数。

函数的三要素：

1.函数名

2.参数（形参，实参）

3.返回值

声明函数：

1.字面量

书写格式：关键字 函数名 （） {函数体}；

function

例子：

function xiaolei(){

console.log(`F72`);

}

2.构造函数

例子：

let xiaohai= new Function();

console.log(typeof xiaohai);//function

3.函数表达式

书写格式：关键字 标识符 赋值符号 function 函数名（）{函数体}

例子：

let xiaohai = function (){

console.log(`F73`);

}

xiaohai();

 

函数的调用

书写格式：函数名（）

返回值

书写格式：return 表达式；

 

参数

1.形参:形式参数a,b

形参默认值

书写格式：形参名=表达式

1.若形参有对应的实参，就用实参值

2.若形参没有对应的实参，就用默认值

3.若形参没有对应的实参，也没有默认值，值就为undefined

形参的个数

函数名.length

注：不会统计默认值的形参及默认值以后的形参。因此，统计形参的个数时应把带默认值的形参放到后面

2.实参：实际参数1,2

例子：

function xiaoliao(a,b){

return a+b;

}

console.log(xiaoliao(1,2));

形参与实参的个数不同

1.形参个数多，多的形参值为undefined

2.实参个数多，...标识符接受多的参数（...标识符必须是最后一个形参）

3.arguments存储所有的实参

使用方式：arguments[下标]

arguments.length 实参个数

但是arguments不是数组（类数组）

原因：不能使用数组的方法

变量提升与函数提升

1.变量提升

提升var声明的变量（不包含函数）

提升变量的声明（即赋值不提升）

2.函数提升

提升字面量声明的函数

提示整个函数

 

 

回调函数

函数A当参数给函数B使用，A就是回调函数

例子：

function f71(){

console.log(`F71`);

}

function f72(fn){

console.log(`F72`);

fn();

}

f72(f71);//F72，F71

常用的回调函数

1.数组的排序 sort

升序

例子：

let arr = [8,2,4,9,12,73,3,11];

arr.sort(

function(a,b){

return a-b;

}

 

);

console.log(arr);

降序

let arr = [8,2,4,9,12,73,3,11];

arr.sort(

function(a,b){

return b-a;

}

 

);

console.log(arr);

 

every所有的值都满足条件，返回才返回true，否则返回flase

例子：

let arr = [8,2,4,9,12,73,3,11];

let i =arr.every(items=>itmes%2==0);

console.log(i);

some所有的值都不满足条件，返回flase，否则返回true

例子：

let arr = [8,2,4,9,12,73,3,11];

let i =arr.some(items=>itmes%2==0);

console.log(i);

filter：返回满足的值

例子

let arr = [8, 2, 4, 9, 12, 73, 3, 11];

let i = arr.filter(items => items % 2 == 0);

console.log(i);//[ 8, 2, 4, 12 ]

map：会遍历数组的每一个值，并且返回一个新数组，即新数组的数据是原数组操作后的结果

例子

let arr = [8, 2, 4, 9, 12, 73, 3, 11];

let i = arr.map(items => items % 2 == 0);

console.log(i);//true,true,true,false,true,false,false,false

forEach：会遍历数组的每一个值，并其进行操作，无返回值（undefined）

注：break无效

例子

let arr = [8, 2, 4, 9, 12, 73, 3, 11];

let i = arr.forEach(items => console.log(items+100));

//108 102 104 109 112 173 103 111

立即执行函数：声明即调用，调用即销毁

IIFE：Immediately Invoked Function Expression

使用场景：登陆提示

 

箭头函数

1.省略了function函数

2.只有一条语句可以省略大括号

3.只有一条语句，并且这条语句是返回的表达式们可以省略return

4.若参数只有一个，可以省略小括号

5.不可以使用arguments

6.DOM（会讲什么是this） 不会把自己的this绑定到函数

7.不可以用作构造函数

 

【扩展】

并集

例子

let set1 = new Set([1,2,3]);

let set2 = new Set([2,3,4]);

let set3= new Set([...set1,...set2]);

console.log(set3);//Set(4) { 1, 2, 3, 4 }

交集

例子

let arr1=[1,2,3];

let arr2=[2,3,4];

let arr3=arr1.filter(items=>arr2.indexOf(items)!=-1);

console.log(arr3);//[ 2, 3 ]

差集

例子

let arr1=[1,2,3];

let arr2=[2,3,4];

let arr3=arr1.filter(items=>arr2.indexOf(items)==-1);

console.log(arr3);//[ 1 ]