·总结一些JS的一些基础供参考

数据类型

对象

1· 对象特征：

1. 对象由键值对组成

2. 键值对由逗号隔开

3. 键值对由属性名和属性值组成

4. 属性名和属性值用冒号隔开

5. 前面的是属性名，后面的是属性值

6. 对象没有length属性

console.log（a.length);//undefined复制代码

2·获取某个属性名对应的属性值

1. 对象名、属性值

var obj={a:1,b:2,c:"zhufeng",1:100}console.log(obj.a);console.log(obj["a"]);复制代码

2. 新增键值对

var obj={a:1,b:2,c:"zhufeng",1:100}obj.d="培训";obj["d"]="培训";console.log(obj);复制代码

3. 修改键值对

如果没有就算新加，有就是修改

var obj={a:1,b:2,c:"zhufeng",1:100}obj.c="培训";obj["c"]="北京";console.log(obj);复制代码

4. 删除键值对

delete + 对象名，属性名var obj={a:1,b:2,c:"zhufeng",1:100}delete obj.c;console.log(obj);obj.a如果放在等号的左边，那么是被赋值或修改；放在等号的右边，是在获取赋值obj.a=10；obj.a=obj.b复制代码

5. 只要是以值存在的一定是一个具体的数据类型值;

放在等号后面或者对象属性名冒号的后面一定是值;

var obj={a:1,b:2,c:"zhufeng",1:100}var d=19;var obj={a:1,b:"zfpx",c:d};obj.a=11;obj.a=a;复制代码

number

number：整数 小数 NaN;

NaN：不是一个数字，但是number类型的；

1. Number：把其他数据类型的值强制转换为number类型

var  a=Number("213");//213var  a=Number("213px");//NaNvar  a=Number(false);//true=1  false=0var  a=Number(false);//null=0  undefined=NaN复制代码

2. isNaN：用来判断是否是一个非有效数字的方法，如果是有效数字返回false，不是返回true；

3. isNaN 执行时先默认调用number方法，把值转换为number类型；然后再判断

console.log(isNaN(19));false;console.log(isNaN(NaN));true;复制代码

4. parseInt：把字符串转成数字，从左到右依次识别，直到遇到一个非有效数字为止，把识别到的以数字形式返回

console.log(parseInt("12px"));12;console.log(parseInt("12px12"));12;console.log(parseInt("px12"));NaN;复制代码

5. parseFloat：比parseInt多识别一位小数点

console.log(parseFloat("12.66px"));12.66console.log(parseFloat("12.66.66px"));12.66复制代码

6. toFixed：保留小数点位数，返回一个 字符串，并且进行了四舍五入

var num =12.8998;// number.toFixed(保留的位数)199.22222.toFixed(3);console.log(num.toFixed(2));//199.200复制代码

基本数据类型和引用数据类型

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

2. 引用数据类型：对象数据类型和函数数据类型

3. 对象数据类型： 对象{} 数组[] 正则 Math Date的实例...

4. 函数数据类型： 函数类

5. 基本和引用区别：

6. 基本数据类型操作是值

7. 引用数据类型操作的是空间地址

8. 基本数据类型存储到栈内存中

9. 引用数据类型都存储到堆内存中

var  num = 100;    var  obj = {};// obj 存储的是一个空间地址；    var  arr = [];复制代码

js数据类型检测

typeof：检测数据类型的运算符

// 用typeof检测数据类型console.log(typeof 100);  // "number"console.log(typeof "zhufeng");   //"string"console.log(typeof true);  //"boolean"console.log(typeof null); //"object"console.log(typeof {});  //"object"console.log(typeof []); //"object"console.log(typeof function); //"function"console.log(typeof undefined); //"undefined"复制代码

instanceof：检测某个实例是否属于这类

constructor：获取当前实例的构造器

Object.prototype.toString.call:获取当前实例的所属类信息

1. 使用typeof检测，返回的结果是一个字符 串，字符串中包含的内容证明了值是属于 什么样类型

数组

引用数据类型：空间类型

1. 有lenght和索引

数组是由数组成员组成，数组成员用逗号隔开

1. 有length：属性值代表数组成员的个数

2. 索引：代表数组成员的属性名从0开始

var arr=[1,2,3,4,100];console.log(arr.length);复制代码

3. 有索引的;索引从0开始;依次递增1;

var arr=[1,2,3,4,100];console.log(arr[2]);复制代码

push

1. push:在数组末尾追加元素

2. push方法的参数：要追加到数组后面的元素；可以是多个；用逗号隔开

3. 需要传参

4. push方法的返回值：执行完成，新数组长 度

var arr =[1,2];arr.push("a"); // [1,2,"a"]console.log(arr);复制代码

pop

1. pop：从数组末尾去掉一个元素

2. pop:方法没有参数

3. pop：返回值；删除末尾数组元素后的数组

4. pop方法原数组发生变化

var arr=["a","n",1,"m"]; //length=4var ret=arr.pop();console.log(arr);复制代码

unshift

1. unshift：在数组的前面添加元素

2. unshift:方法参数：要添加的值；可以为 多个参数

3. unshift：返回值新数组长度，lenght

var arr=[1,2,3,4];arr.unshift(0);console.log(arr)复制代码

shift

1. shift：从数组的前面删除一第个元素

2. shift方法没有参数

3. shift方法返回值：被删除的数组的第一项成员

var arr=[1,2,3,4,5]; arr.shift(1);console.log(arr);复制代码

slice

1. slice：截取数组

2. slice：方法参数：如果是两个参数；第一个参数是开始位置的索引；

3. 第二个参数是结束为止的索引；不包括第二个参数的位置

4. slice返回值：截取的那一部分数据，以数组的方式返回

5. 如果是一个参数参数是开始位置的索引截取到整个数组的最后一位

6. 参数如果是负数；数组的长度+负数得到的值；数组的下标

7. 没有参数复制一份数组

8. 原有数组不发生改变

9. 支持负数

var arr=[1,2,3,4,5,6,7];arr.slice(2,5)；console.log(arr)；复制代码

splice

1. splice：删除原有数组的项第一个参数；开始位置的索引删除的长度；返回值是删除的项；以数组的形式返回

2. 替换/修改第一个参数，开始位置的索引

3. 第二个参数，是删除的长度，剩下的参数；被添加到原来开始位置索引的数组元素

4. 添加：第二个参数为0（不删除），然后再原有的位置；添加后面参数元素的值。

5. 原来的数组发生了变化

6. 参数为0全部删除

var arr=["a","b","c","d","e","f"];arr.splice(2,2);console.log(arr);复制代码

sort

1. sort:排序 只能排相同位数的数组

2. 对数组进行排序

3. 参数可有可无

4. 没有参数 只能排相同位数

var ary=[1,23,435,46,34,653];ary.sort(function(a,b){
   return a-b}) 从小到大ary.sort(function(a,b){
   return b-a}) 从大到小复制代码

reverse

1. reverse:将数组倒序排列

2. 不需要参数

3. 返回值是数组倒序之后的数组

4. 原有数组发生改变

indexOf

1. indexOf：用来获取当前数组成员第一次出现的索引位置

2. 需要参数；如果数组成员不存在这一项返回-1

3. 如果参数存在 返回当前项索引 不存在返回-1

4. 原有数组不发生改变

5. 0返回也是-1

lastIndexOf

1. lastIndexOf:用来效验数组成员最后一次出现的索引位置

2. 需要参数 如果不存在返回-1

3. 返回最后一次的索引或者是不存在就返回-1

4. 原有数组不发生改变

5. 0返回也是-1

concat

1. concat:数组的拼接

2. 需要参数 没有参数就是复制一样的参数

3. 返回是拼接后的数组

4. 原有数组不变

join

1. join：按照指定的字符进行拼接成一个字符串

2. 需要参数 如果不写 默认是逗号隔开

3. 返回一个连接后的字符串

4. 原有数组不变

forEach

1. forEach:用来遍历数组每一项

2. 需要参数 1、第一个是数组的每一项 2、数组成员的索引 3、要循环的数组

3. 返回的是undefined

4. 原有数组不发生改变

ary.forEach(function (a,b,c){    a:数组的每一项    b:数组成员的索引    c:要循环的数组})复制代码

map

1. 循环数组

2. 有返回值

3. map:遍历 映射

4. 需要参数

5. 返回是映射之后的数组

6. 原有数组不发生变化

7. map里有return属性

Math

1. Math 是一个对象数据类型的

console.log(Math);console.log(typeof Math);复制代码

1. Math.abs(); 取绝对值

console.log(Math.abs(3)); //3复制代码

2. Math.floor(); 向下取整

console.log(Math.floor(5.9999)); //5复制代码

3. Math.ceil(); 向上取整

console.log(Math.ceil(5.0001)); //6复制代码

4. Math.max(); 获取一组数的最大值；

console.log(Math.max(12,3,22,56,5,7,8)); //56复制代码

5. Math.min(); 获取一组数的最小值；

console.log(Math.min(1,23,45,2,4,5)); //1复制代码

6. Math.random(); 产生一个0--1的随机小数

console.log(Math.random());复制代码

7. Math.round(); 四舍五入

console.log(Math.round(4.756));  //5复制代码

8. 产生一个m-n之间的随机整数

Math.round(Math.random()*(n-m)+m)复制代码

9. Math.pow(m，n); 获取m的n次幂

console.log(Math.pow(3,3)); // 3*3*3--27复制代码

10、Math.sqrt(16); 开16的平方---4

console.log(Math.sqrt(16)); //4复制代码

字符串的方法

1. 有length

2. 索引

3. 字符串是不能根据索引修改的、只能用索引来获取

4. 字符串运算

5. +是字符串拼接 其余转number再运算

标记js表达式 ${变量名}

var srr="Rocky"var str=`ma name is ${srr}`console.log("3px"-"3");  //NaN复制代码

1. toUpperCase： 把小写字母变成大写

原有字符串不发生变化

var sTc="zhufengpeix"console.log(str.toUpperCase());//'ZHUFENGPEIX'复制代码

2. toLowerCase: 把大写转小写

console.log(sTr.toLowerCase());复制代码

3. charAt: 通过索引获取对应的字符

console.log(sTc.charAt[3]);复制代码

4. charCodeAt: 获取对应的字符的Unicode编码值

console.log(sTr.charCodeAt(3));97-122  a-z  65-90 A-Z复制代码

5. substr： 字符串的截取；从索引m开始，截取n个；如果只有一个参数；截取到末尾

console.log(str.substr(2));复制代码

6. substring(m,n);从索引m开始，截取到索引n;但不包含n

console.log(str.substring(2, -5));复制代码

7. slice(m,n);从索引m开始，截取到索引n;但不包含n;slice 支持负数传参

console.log(str.slice(2, -5))复制代码

8. replace : 替换replace(old,new);用新字符串替换旧字符串

console.log(str.replace("e", "a"));复制代码

9. indexOf: 检测字符串第一次出现的索引位置 如果不存在返回-1

console.log(str.indexOf("h"));复制代码

10. lastIndexOf:检测字符串最后一次出现的索引位置 如果不存在返回-1

console.log(str.lastIndexOf("e"));复制代码

11. split: 按照特定的字符分割成数组中的每一项

//支持正则console.log(str.split(" "));复制代码

12. concat： 字符串拼接

console.log(str.concat("aaaa"));复制代码

13. trim： 去空格 去字符串左右的空格

console.log(str.trim());复制代码

14. trimLeft（）：去掉字符串左边的空格

console.log(str.trimLeft());复制代码

15. trimright（）： 去掉字符串右边的空格

console.log(str.trimRight());复制代码

js中字符串的属性和方法

js获取元素的方式

通过id获取元素

1. 元素是个对象 元素都是对象数据类型的

2. 获取不到 获取结果是null

3. 名字相同 只获取第一个

4. 上下文只能是document

var oBox= document.getElementById（"id名"）//通过标签名获取元素复制代码

1. 获取的元素是一个元素集合

2. 支持元素作为该方法的上下文

var oBox= document.getElementsByTagName（"标签名"）通过class名获取元素复制代码

1. 如果需要获取具体的某个元素 需要加上索引

通过class名获取DOM元素

var oBox= document.getElementsByClassName（"class名"）通过name名获取元素复制代码

1. 获取元素集合 一般用于表单元素

    
var oBox= document.getElementsByName（"boss"）复制代码

通过选择器获取元素

1. 如果是id加上#

2. 如果是class 加上.

var oBox= document.querySelector（"选择器"）复制代码

获取body元素

document.body复制代码

获取HTML

document.documentElement复制代码

获取所有的元素

    
    
    
console.log(document.querySelectorAll("div"))复制代码

DOM的节点以及属性

节点是组成DOM树的基本单位

节点分为四种 元素节点 文本节点 注释节点 document；他们都是对象数据类型的

nodeType nodeName nodeValue

元素节点 1 大写的标签名 null

文本节点 3 #text 文本内容

注释节点 8 #comment 注释内容

document 9 #document null

属性

1. childNodes: 当前元素所有的子节点

2. children: 当前元素的所有的子元素节点

3. parentNode：获取当前元素的父亲节点 document是根节点；他的父亲节点是null

4. previousSibling：上一个哥哥节点

5. previousElementSibling:上一个哥哥元素节点

6. nextSibling:下一个弟弟节点

7. nextElementSibling:下一个弟弟元素节点

8. firstchild：第一个子节点

9. firstElementChild：第一个子元素节点

10. lastChild：最后一个子节点

11. lastElementChild：最后一个子元素节点

空格和换行符都是文本节点

console.log(box.childNodes);console.log(box.children);console.log(last.parentNode);复制代码

获取上一个哥哥元素节点，兼容所有浏览器

function getBrother(curEle) {         var pre = curEle.previousSibling;                while(pre)                {            if(pre.nodeType===1){                return pre;            }                        pre = pre.previousSibling;                        // pre等于哥哥节点的哥哥节点；        }    }复制代码

动态操作DOM元素

1. document.createElement:创建一个元素

var new = document.createElement（"div"）复制代码

2. appendChild(元素)

// 向容器末尾添加子节点
    
box.appendChild(元素)复制代码

3. insertBefore

// 向容器中的某个元素前面插入新元素容器.insertBefore（newChild，oldChild）box.insertBefore(newDiv,firet)复制代码

4. removeChild

//删除子节点容器.removeChild（oldChild）box.removeChild(ul)复制代码

5. replaceChild

//用新的子节点替换老的子节点容器.replaceChild(newChild,oldChild)box.replaceChild(newDiv,ul)复制代码

6. cloneNode

7. 克隆同样的元素

8. cloneNode的参数一个是true代表深度克隆将后代节点也克隆出来

9. false：不传就是false；浅克隆 克隆元素本身 不能克隆元素里的所有后代节点

10. 默认情况下只能克隆元素本身 不能克隆元素里的所有后代节点

11. 不能克隆点击事件

var divs=box.cloneNode(ture)复制代码

7. getAttribute

// 获取行间属性所对应的属性值
    
box.getAttribute("zfpx")复制代码

8. setAttribute

//设置行间属性对应的属性值box.setAttribute("a",100)复制代码

9. removeAttribute

//移除行间属性
    
box.removeAttribute("zfpx")复制代码

10. classList

11. add 新增类名

12. remove 移除类名

13. replace 改变类名（前一个旧类名，后一个新类名）

box.classList.add("a")box.classList.replace("a","b")//前一个参数旧的  后面是新的class复制代码

Date

1. new + 函数：创建这个函数的实例;实例是个对象数据类型

2. new 是个关键字：

console.log(new Date()); //获取当前电脑的系统时间复制代码

1. getFullYear（）：返回时间年

2. getMonth（）: 返回时间月【0-11】

3. getDate（）： 返回当前日【1-31】

4. getDay（）： 返回星期几 【0-6】星期日是0

5. getHours（）： 返回小时 【0-23】

6. getMinutes（）： 返回时间分钟数 【0-59】

7. getSeconds（）：获取时间秒

8. getMilliseconds（）：获取毫秒数

9. getTime（）： 当前时间距离1970-1-1上午8：00 毫秒差

10. Date.now（）：经常用于产生一个时间戳：产生一个唯一的数字

定时器

1. setTimeout 和setInterval

2. 定时器返回值

3. 清除定时器 ：claearInterval

JS 的组成部分

ECMAScript :

规定了JS基础语法，变量、数据类型、操作语句、函数等

DOM : 文档对象模型；

BOM : 浏览器对象模型

JS 的引入方式

1. 行内式 内嵌式 外链式

JS 的输出方式

1. alert 弹框 将参数转成字符串输出

2. console.log在控制台输出参数可为多个

3. confirm 弹框有取消按钮

4. document.write()在文档写入内容可以识别标签

JS中的变量

1. 由字母、数字、下划线、$组成；

2. 不能以数字开头，严格区分大小写

3. 遵循驼峰命名，第一个单词的首字母小写，其余有意义的单词首字母大写

4. 不能使用关键字和保留字；

innerHTML innerText

1. innerHTML 可以识别标签，innerText 不可以识别标签

2. = : 赋值

var a = document.getElementById("a");        a.onclick = function () {                a.innerHTML += 123    }复制代码

数据类型number

1. number 可以是整数、小数、NaN（not a number）

Number

2. isNaN : 校验是否是一个非有效数字

3. parseInt：把字符串转成数字，从左到右依次识别，直到遇到一个非有效数字为止把识别到的以数字形式返回

4. parseFloat :多识别一位小数点

5. toFixed ： 保留小数点位数

var  a = Number("18")string复制代码

6. length 索引 "" '';

7. 字符串的运算 - * /

8. : 字符串的拼接

布尔类型

1. boolean : true false

2. Boolean :

3. js的内置方法；在全局作用下

4. 0 "" NaN null undefined只有这五个值转 布尔是false

5. ! : 先把后面的值转成布尔，再取反

console.log(![] == [])// true     console.log([]==[])// false        console.log(![]==false);//true    console.log({a:1}=="[objectobject]")//trueconsole.log("12px" == 12);复制代码

6. ! : 会先把后面的值进行去布尔，然后再取反，最后比较

7. null undefined： 都表示没有

var obj = {a:1};//obj=null;        var  a;            console.log(a);        console.log(obj.b);// undefined复制代码

三个判断

if / else

1. if (如果)

2. else if （再者）

3. else （否则）

switch

break（终止）

三元运算符

ID

1. js中如果ID名重复，只能获取第一个id的元素

2. ID名不能重复、

3. 如果通过id名获取不到内容，那么获取的结果是null

js的输出方式

1. console.log()在控制台输出

2. 经常用于调试bug 开发人员使用

console.log(100);复制代码

2. alert：弹出

3. 有且只有弹出第一个数

复制代码

1. 会让代码停止到这一行

2. 会把弹出的值转成字符串，默认调用tostring方法

如果控制台是数字，字体颜色是蓝色

如果控制台是字符串，字体颜色是黑色

（单双引号包起来的都是字符串）

3. confirm：相对于alert多一个取消按钮

如果点击确定，代表true，点击取消，代表false

prompt：在confirm基础上增加让用户输入的效果

用户点击取消按钮，我们获取到的结果是 null（空） ，用户点击的结果是确定，

我们将会获取到用户所输入的内容（如果用户没有输入内容，那么获取的将会是空字符串）

使用原生js封装模态框组件

4. console.dir:详细输出

5. console.table:把json数据以表格的形式输出

在js中定义一个变量

变量：值是可以变的

1. 变量其实是一个无意义的名字，它所代表的意义都是其存储的值

2. 常量：值是不可变的

3. var + 变量 =值

4. 变量名是自己起的

5. 定义一个变量名是a，把这个10的值赋值给a，那么a代表这个10

var a=10;console.log(a);console.log(a+10);复制代码

4. 变量命名规范

5. 变量名是由字每，数字，下划线，￥组成

6. 变量名数字不能开头，严格区分大小写

7. 遵循驼峰命名法；第一个单词首字母小写；剩余有意义的单词首字母大写；

8. 关键字和保留字不能作为变量名

9. 关键字：在js中有特殊意义的单词都是关键字

10. 保留字：未来有可能成为关键字的单词

js属性

1. innerHTML：改变元素中的内容，而且识别标签

    
复制代码

2. innerText：不能识别标签

3. οnclick=function 鼠标点击事件

4. 前面加元素名

var a= document.getElementById("box")；a.onclick=function() {        //点击时，此处代码运行a.innerHTML="
    
     百度";};复制代码
    

引用数据类型分为：对象数据类型和函数

数据类型

1. 对象数据类型：对象 数组 正则

2. Dote的实例 Math

3. 布尔数据类型

1、Boolean

1. 在boolean只有两个值：true和false

2. true：正确 false：错误

3. true--1 false--0

4. boolean把其他类型转布尔类型方法；返回值只有正确和错误

5. 在js中只有0、“”、null、undefined、NaN 这五个值转布尔值是false 其余全是true

6. 负数也是true

console.log(Boolean(0));--falseconsole.log(Boolean(2));--true复制代码

！：取反

1. 首先会把后面的值转成布尔值，然后再取反

console.log(!NaN);--true     console.log(!"12px");--false复制代码

string：字符串

1. 字符串：用单引号或双引号包起来的值就是字符串类型

2. length：有长度，length的属性值代表字符串的个数

var str="wdaifhauohfiuahgfia"console.log(str.length);复制代码

2. 有索引 索引从0开始第二个字符串索引可就是1

console.log(str[3]);console.log(str[str.length-1]);复制代码

获取字符串最后一项：

3. 字符串运算

任何数字和NaN运算都是NaN

加法是字符串的拼接

减法、加法、除法是先把字符串转成number类型，然后运算

console.log("18-16");2console.log("18px"-"12");6console.log("18px"*"12");216console.log("18px"/"12");1.5console.log("18px"+"12");18px+12console.log("18"+"12");1812复制代码

null和undefined都表示没有

null表示现在没有，以后可能会有、undefined表示现在没有，以后也不可能有

null:

1. 通过id获取元素如果获取不到内容，那么默认返回值是null

2. 如果需要销毁对象的堆内存，那么会给对象赋值为null

3. 正则进行捕获，捕获不到内容，那么返回值是null null表示对象指针

数组去重

1. indexOf

2. 对象；循环对象；放入新的数组中

3. 操作原有的数组

冒泡排序

1. 冒泡排序：让相邻两项进行比较如果前面一项比后面一项大，让其交换位置

递归

1. 递归：针对函数：在函数内部调用函数本身；让其执行，这种现象就是函数的递归

2. 需要结束条件，结束当前循环

3. 递归的时候一定要有一个结束条件 否则会一直循环下去

快速排序

1. 快速排序原理：获取到数组的中间项然后让数组中的每一项和中间项进行比较

插入排序

1. 新建一个数组

2. 把旧数组的第一项push到新数组中

3. 取旧数组中的每一项和新数组中的每一项比较

在js中，遇到{}、[]都会开辟一个新的空间地址

1. = 赋值

2. 把10赋值给变量hh

var hh=10;复制代码

2. == 比较；返回一个布尔值；相等返回true，不相等返回false

3. 允许不同数据类型之间的比较

4. 如果是不同类型的数据进行，会默认进行数据类型之间的转换

console.log(1==1);//trueconsole.log(1=="1");//trueconsole.log(1=="1px");//falseconsole.log(1==true);//true复制代码

如果是对象数据类型的比较，比较的是空间地址

console.log({}==[]);//falseconsole.log({}=={});//falseconsole.log([]=="");//trueconsole.log([]==0);//true复制代码

{} 调用跑哪个tostring转换成字符串结果是“[object object]”

3. === 绝对比较；只要数据类型不一样，那么返回false

console.log(1 === 1 );//trueconsole.log(1 ===true );//falseconsole.log(1 === "1");//false复制代码

js判断语句

1.操作语句：三个判断、三个循环

2. 浏览器从上到下进行判断、如果条件成立 就执行那块代码

3. 只要有一处满足条件，下面即便条件成立 都不执行

4. 小括号中的条件最后一定要转成一个布尔值

if ([])console.log(1)复制代码

条件嵌套、两个条件同时满足，才成立

if（20>10）{    if（11<18）{    }}复制代码

2. 三元运算符

//条件？条件成立执行：条件不成立执行'18=="18px"?console.log(18):console.log(19);复制代码

3. switch case

绝对比较

var num =10；switch （num）{    csae "10":    console.log(1);    break;  //终止不让向下进行判断        case "10px"：    console.log(2);    break;        case 10:    console.log(3);    break;      default:   //当以上条件都不成立时、执行此处代  码  console.log(4)  }复制代码

逻辑运算符

1. && ：并且、同时满足

2. || ：或、只要其中一个满足

3. &&

if（1==1 && 1==="1"）{    //当两个条件都成立、整体才成立    console.log(1)；    }||if(isNaN("12px")||3==="3"){    //只要其中一个满足、条件成立    console.log(3)；    }复制代码

三个循环

1. JS 是单线程的、同一时间、只能做一件事

2. for 循环的四步曲

3. 定义变量i;

4. 判断条件是否成立

5. 执行循环体

6. 执行i++

//执行过程1-->2-->3-->4-->2-->3-->4..

for

for(va i=0; i<10; i++){        console.log(1);}  console.log(2);continue:停止本轮循环for(var i=0;i<10;i++){        if(i>5){        continue    }    console.log(100);}break:终止整个大循环for(var i=0;i<10;i++){        if(i>5){        break;    }    console.log(100);}复制代码

for in

var  obj={a:1,b:3,str:"www"};for(var key in obj){    //key:代表属性名、而且是个字符串    console.log(key);    //obj[key] 代表属性名对应的属性值    //会把属性值是数字的先输出    //输出循序会根据属性名进行排序、从小到大依次输出    console.log(obj[key]);}复制代码

while

1. 一般用于不知道循环多少次时，用while

2. 阻塞主线程、让代码在此处停留

3. 同异步

var  i=0;    while(i<4){        //改变while的条件一般在循环体中进行修改；    console.log(100);        i++;    }复制代码

do while

1. 先执行；后判断

var i=0do{    console.log(111)    i=i+2}while(i<10);复制代码