编程
利用程序设计语言编写程序代码
计算机程序：计算机所执行的一系列指令集合
计算机语言：
- 机器语言,计算机执行
- 汇编语言
- 高级语言，包括很多编程语言，如C,JS
标记语言：不向计算机发出指令，常用于格式化和链接，存在时
编程语言：用来控制计算机的一系列指令 - 汇编语言
- 高级语言，包括很多编程语言，如C,JS
翻译器：（将源代码变成及计算机语言）
计算机基础
由硬件和软件组成
2.2数据存储
所以数据、程序是以二进制存储到硬盘
2.3数据存储单位
2.4 程序运行
打开某个程序时，先从硬盘中把程序代码加载到内存中
CPU执行内存的代码（CPU快，内存是电，硬盘是机械）
JavaScript
初识
历史
是什么
脚本语言：一行一行，翻译一行，执行一行
作用
1.输入时即判断表单是否合格
HTML/CSS标记语言
JS编程类语言
浏览器执行JS简介
浏览器分为两部分：渲染引导（内核，解析HTML和CSS）+JS引擎（读取网页中的JavaScript代码）
浏览器本身不会执行，通过内置JS引擎，逐行解释转换成机器语言，然后计算机去执行
JS组成
DOM提供的接口可以对页面的各种元素进行操作（大小、位置、颜色等）
BOM与浏览器窗口进行互动的对象结构，可以操作浏览器窗口
JS
行内、内嵌、外部
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 内嵌式 -->
<script>
alert('我是人');
</script>
<!-- 外部JS -->
<script src="my.js">
</script>
</head>
<body>
<!-- 行内式，alert弹出框，里面单引号，外面双引号 -->
<input type="button" value="xxc" onclick="alert('aiguo')">
</body>
</html>
注意
外部JS中间不可以写代码
JS注释
//单行, ctrol+/
/duoahng/ shift+alt+a
JS输入输出语句
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 输入框-->
<script>
// 输入框
prompt('输入年龄');
// alert展示给用户
alert('哈哈哈哈');
console.log('程序员看到的');
</script>
</head>
变量
概述
本质：变量是在内存中申请的一块用来存放数据的空间
使用
1、声明 2、赋值
var age;
age=10;//数字不用加引号
var是一个JS关键字，用来声明变量
声明变量加赋值-变量的初始化
var name='pink'
<script>
var name=prompt('输入名字');
alert(name);
</script>
属入名字，同时弹出名字的值
变量语法扩展
1、更新语法
2、同时声明多个变量
中间逗号，最后分号
<script>
var name='xxc',
age=18,
address='cq';
</script>
3、声明变量的特殊情况
- 只声明不赋值，结果undufined
- 未声明，未赋值，直接使用，会被报错
- 不声明，直接赋值。可以的（变成全局变量）
变量命名规则
$和_可以做变量开头，中间不能有空格
<script>
var c1='xxc',
t,
c2='cq';
t=c1;
c1=c2;
c2=t;
console.log(c1);
console.log(c2);
</script>
数据
简单数据类型简介
数据和存储空间有关系
JS是一种弱类型/动态语言。数据类型由变量的数据类型来判断
简单数据类型
数字型进制
前面加0表示八进制（0~7）
输出时默认格式为十进制
前面加0x表示十六进制（09,af）
数字型范围
isNaN()
判断是否为数字，如果是，则是false;否则true
字符串型
里面有引号
引号嵌套，外双内单/外单内双
字符串转义字符
字符串长度
属性lengthvar ch='xxc';alert(ch.length);
字符串拼接
数值相加，字符相连
<script>
console.log('ss'+true);//最后结果是字符串
console.log(12+12);//结果24
console.log('12'+12);//结果1212
</script>
字符串拼接加强
变量单独相加，变量不能加引号，加引号会变成字符串
简单交互效果
- 用户输入
- 程序内部处理
- 输出结果
布尔型Boolean
值：true和flase
布尔型和数字运算，是数值运算
true=1,false=0
数字和null运算，null 变成0，进行数值运算
var flag=true; alert(true+1);//结果为2
Undefined
变量声明未赋值，
null空值
<script>
var flag=true;
alert(true+1);//结果为2
// undefined
console.log(str);//或者var str=undefined
console.log(str+'pink');//结果是undefinedpink
console.log(str+1);//和数字相加结果是NaN不是数字
// null
var s=null;
console.log(s+'pink');//nullpink
console.log(s+1);//1
</script>
获取变量数据类型
typeof ,
<script>
var flag=true;
console.log(typeof flag);
</script>
通过prompt取过来的值是字符型
字符串型是黑色，蓝色数字，深一点布尔型，undefined和null是浅灰色
数据类型转换
- 转化成字符串类型
<script>
var age=18;
// 1
var str=age.toString();
console.log(String(age));
// 2
console.log(typeof age);
console.log(typeof str);
// 3
console.log(age+'');
- 数字型
<script>
console.log(parseInt('3.14'));
console.log(parseFloat('3.14'));
</script>
- 布尔型
Boolean（‘’）；
代表空、否定的值会被转换成false，如‘’、0、defined、NaN、null、undifined
其它都是true
解释型语言和编译型语言
运算符
算数运算符
+、-、*、\、%
尽量避免用浮点数直接进行运算和比较（精度有误差）
String参与的数据运算
只要有字符串+任意类型=拼接之后的字符串
- 和Boolean类型
若字符串有非数字字符串，除了加号，其它运算符输出结果为NaN;字符串为纯数字时，其它为数值运算 - 和undefined
除了+，其它结果都是false - 和Null
和Boolea类型一样
总结：
字符串数值运算，+直接拼接。其它，undefined结果为false；再其它，纯数字字符串数值运算，不纯结果通通为NaN
比较运算符
！==表示不全相等
等号符号，是==默认转换数据类型，会把字符串的数据转换成数字型（只要求值）。
console.log(18=='18');//true
完全等于===
console.log(18==='18');//false
数值参与的混合比较运算
- 数值和String比较运算
字符串为纯数字，转换成Number类型比较，字符串包含字母，输出结果都为false - 数值和undefined进行比较时
结果都是false（这个比较直接） - 数值和布尔型比较运算
布尔转换成Number类型 - Number和Null比较
布尔转换成Number类型
String参与的比较运算
- 和Boolean
若字符串有非数字字符串，输出结果为false；纯数字，转换为数值进行比较 - 和undifined比较
输出结果都是false - 和null比较运算
同Boolean
总结：
比较运算中，只要有undifined结果都是false;字符串参加的，纯数字数值比较，不是的结果直接为false
逻辑运算符
用来进行布尔运算的运算符，其返回值也是布尔值
&&、||、!（存在逻辑中断）
数组
数据的集合
创建数组
== new创建数组==
var arr =new Array();//创建一个空的数组
var arr=new Array(2);//创建长度为2的数组
var arr =new Array(2,3);//创建[2,3]的数组
利用数组字面量创建数组
<script>
var arr=[];//创建空数组
var arr1=[1,2,'pink',true];//里面可以放任意类型数据
</script>
获取数组的元素
== 数组的索引==
arr[0]=1
数组的方法
pop(）删除并返回数组的最后一个元素
push() 向数组末尾添加一个或更多元素，并且返回新的长度
shift() 删除并且返回数组的第一个元素
unshift() 向数组的开头添加一个或更多元素，并返回新的长度
<script>
var char=[1,2,3,4];
console.log(char.pop());//删除并返回数组的最后一个元素
console.log(char);
</script>
<script>
var char=[1,2,3,4];
console.log(char.push(5,5));//在末尾增加一个元素，并返回新的长度
console.log(char);
</script>
<script>
var char=[1,2,3,4];
console.log(char.shift());//删除并且返回第一个元素
console.log(char);
</script>
<script>
var char=[1,2,3,4];
console.log(char.unshift(2,4));//添加并且返回新的长度
console.log(char);
</script>
总结
有p的都是在数组后面操作，删除返回值为被删的元素；新增返回值为新的长度
sort()数组排序，数字从小到大，字母按照ASCII码
arr.reverse()表示将数组逆序
<script>
var arr=[1,3,2,4];
arr.sort();
console.log(arr);
//同理：arr.reverse()表示将数组逆序
</script>
splice()是拼接的意思们可以删除或者插入，接受参数最少两个及以上
splice（起始位置，删除元素个数，插入元素）
第二个元素
. 为0时，表示只有插入元素
. 不为0且只有两个参数时，表示只有删除操作
. 不为0且有三个及其上个参数时，表示既有删除也有插入操作
<script>
var arr = ["a", "b", "c", "d"];
arr.splice(2, 1); //删除一个元素，从第二个起，不是第二个（从下标2开始），删去第二个。["a", "b", "d"]
var remove = arr.splice(2, 1); //值为'b'（错误），因为这里在["a", "b", "d"]基础上再次调用了两次splice方法,所有remove值为d
</script>
arr.splice(2,1,'e','f')//在第二个位置上删去了'c'，插入'e','f'.["a", 'e','f'，"b", "d"]，这里splice的返回值为'b'
slice()截取原数组中的一段，silce()接受一个或两个参数，第一个表示截取开始的位置，第二个参数表示截取的结束位置区间是左闭右开[),不包括结束位置的下标。只有一个参数，则从位置开始一直截取到数组结束
<script>
var arr = ["a", "b", "c", "d", "e"];
var newArr=arr.slice(2, 4); //结果为["c", "d"],一定要定义一个新数组才行
console.log(newArr);
</script>
split()用特殊字符分割字符串
join()用特殊字符拼接字符串
<script>
var arr = ["acc", "b", "cdd", "d", "e"];
var newArr1=arr.join('%'); //字符串是分散的，用%将它们拼接到一起
console.log(newArr1);//acc%b%cdd%d%e
var str="xxvd-fwe-fw";
var newArr2=str.split("-");
console.log(newArr2);//Array(3) [ "xxvd", "fwe", "fw" ]
</script>
字符串方法
charAt()
<script>
var str="abcfggr";
var n=str.charAt(3);//返回下标3的值
console.log(n);
</script>
concat
<script>
var str1="abcfggr";
var str2='1223';
var n=str1.concat(str2);
console.log(n);//abcfggr1223
</script>
字符串后面自动加\0，字符数组不加
indexOf()返回字符串值在字符串首次出现的位置
<script>
var str1 = "12363545123";
var n1 = str1.indexOf("123"); //0
var n2 = str1.indexOf("123", 5); //从第五个位置开始找"123",10
console.log(n1);
console.log(n2);
</script>
includes()判断是否包含
<script>
var str1 = "12363545123";
var n1 = str1.includes("123");
console.log(n1);//true
</script>
repeat()字符串复制指定次数
<script>
var str1 = "abc";
var str2 = str1.repeat(2);
console.log(str2);//abcabc
</script>
replace()
<script>
var str1 = "abc1234";
str1=str1.replace("a","d");
console.log(str1);//dbc1234
</script>
match方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。返回数组
search()方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符
串。返回与指定查找的字符串或者正则表达式相匹配的 String 对象起始位置。
slice()提取字符串某个部分，并以新字符串返回
<script>
var str1 = "abc1234";
var str2 = str1.slice(2,4);
console.log(str2);//z左闭右开c1
</script>
substring()提取字符串中介于两个指定下标的字符
<script>
var str1 = "abc1234";
var str2 = str1.substring(2,-4);
console.log(str2);//若第二个元素未负数，从0开始，ab
</script>
<script>
var str1 = "abc1234";
var str2 = str1.substring(2);
console.log(str2);//从2到后面结束c1234
</script>
<script>
var str1 = "abc1234";
var str2 = str1.substring(2,2);
console.log(str2);//<empty string>
</script>
split()把字符串分割成字符数组
split方法
<script>
var str1 = "ab c1 23 4";
var str2 = str1.split(" ",3);
console.log(str2);//Array(3) [ "ab", "c1", "23" ]
</script>
trim()删除头尾空白符，空白符包括：空格、制表符tab、换行符等
trim()
<script>
var str1 = " ab c1 23 4 ";
var str2 = str1.trim();
console.log(str2);//ab c1 23 4
</script>
遍历数组
从头到尾访问一遍，可运用str.length
创建一个空数组，var str=‘’;
数组中新增元素
- 修改length长度
<script>
var arr=[];//创建空数组
var arr1=[1,2,'pink',true];//里面可以放任意类型数据
arr.length=5;//扩容，里面默认undefined
arr[3]='xxc';
arr[5]='xj';
arr[0]='0';//替换数组元素
arr='吃饭';//以前数据全部替换
</script>
<script>
var newArr=[];//创建空数组,newArr.length=0
var arr1=[1,2,'pink',true,10];//里面可以放任意类型数据
for(var i=0;i<arr.length;i++)
{
if(arr[i]>=10)
newArr[newArr.length]=arr[i];
}
console.log(newArr);
</script>
函数
使用
声明函数+调用函数
<script>
function 函数名(){
//函数体
}
//function声明函数的关键字，函数名一般是动词
function sayHi()
{
console.log('hi!');
}
// 函数调用，格式函数名();
sayHi();
</script>
函数的封装
把一个或多个功能通过函数的方式封禁起来，对外值提供一个简单的函数接口
函数的参数
形参和实参
如果实参个数多于实参个数，依次取到形参的个数
实参个数小于形参个数，多的那个形参得到的值为undefined,
函数的返回return
把函数结果返回给调用者，
<script>
function getsum(a,b)
{
var sum=a+b;
return sum;
}
console.log(getsum(1,2));
</script>
只能返回一个值
return a,b;//返回结果为最后一个值
return [a,b,a+b];//返回了一个数组
函数有return返回return后面的值，没有返回undefined
arguement的使用
不确定有多少组参数传递时，可以用arguement来获取。是当前函数的内置对象，arguement存储了传递的所有实参
展示形式是一个伪数组，具有length;按照索引方式存储
没有数组的一些方法pop()
函数调用另外一个函数
函数的两种声明方式
前面是利用函数关键字，
第二种：var 变量名=function(){}
<script>
var fun=function()//匿名函数，这里fun是变量名，变量存的是值
{
console.log('我是函数表达式');
}
fun();
</script>
函数表达式也可以参数传递
<script>
var fun=function(a)//匿名函数，这里fun是变量名，变量存的是值
{
console.log('我是函数表达式');
console.log(a);
}
fun('worren');
作用域
链式查找，逐渐上级上级一层一层往上找
JS对象
概念
对象是一个具体事物，是属性和方法的集合，万物皆对象
属性：事物特征（常用名词）
方法：事物行为（常用动词）
1、创建对象（object）
1、利用字面量
对象字面量：{}
<script>
var object={
uname: 'xxc',
age: 19,
sex: 'nv',
sayHi: function() {
console.log('hi!');
}
}
//调用对象1，采用对象名.属性名
console.log(object.uname);
//调用对象2，对象名['属性名']
console.log(object['age']);
//调用对象的方法
object.sayHi();
</script>
变量、属性
变量、属性都是保存数据，变量单独声明并赋值
2、利用new Object创建对象
<script>
var obj=new Object();
obj.uname='xxc';
obj.sex='nv';
obj.sayHi=function()
{
console.log('hi');
}
</script>
3、利用构造函数创建对象
就是把对象里面一些相同的属性和方法抽象出来封装到函数里面
语法格式 function 构造函数名(){ this.属性=值； this.方法=function(){} } new 构造函数名();//调用构造函数
//构造函数首字母大写
function Star(uname,age,sex){
this.name=uname;
this.age=age;
this.sex=sex;
}
var ldh=new Star('ren',18,'nan');//实参传值,ldh就是一个对象了
var dmn=new Star('xxc',19,'nv');
</script>
function Star(uname,age,sex){
this.name=uname;
this.age=age;
this.sex=sex;
this.sing=function(sing){
console.log(sing);
}
}
var ldh=new Star('ren',18,'nan');//实参传值,ldh就是一个对象了
var dmn=new Star('xxc',19,'nv');
ldh.sing('binyu');
console.log(dmn.name);
</script>
**new**
1. 构造函数在内存中创建了一个空的对象，
2. this就会指向刚才创建的空对象，
3. 执行构造函数里面的代码，给这个空对象添加属性和方法，
4. 返回这个对象
遍历对象
for ...in
<script>
var obj={
name: 'xxc',
age: 19,
sex: 'nv'
}
// for(变量 in 对象)，k是变量，不加引号
for(var p in obj){
console.log(p);//得到属性名
console.log(obj[p]);//得到属性值
}
</script>
```
# 同步模式和异步模式
单线程模式（负责执行代码的只有一个，同时只能执行一个任务）
任务的执行模式分为两种
## 同步模式
代码任务依次执行
## 异步模式
1. 回调函数
setTime(()=> {
console.log("nihao");
},3000);
等到预定时间执行
2. Promice
发起请求获得服务器数据，动态更新页面内容，用一种链接结构将多个异步操作串联起来
同步，压栈，执行，打印，弹栈
调用栈
17万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
