js基础
目录
1.JS简述
一个完整的JavaScript实现由ECMAScript、DOM、BOM三个部分构成。
ECMAScript是JavaScript标准。
2.JS的Helloworld
js代码需要写在script标签中。
从上到下,一行一行执行js代码。
js代码用分号 ' ;' 结尾。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--JS代码需要编写到script标签中 type="text/javascript" 写不写都可以,默认就是它 --> <script type="text/javascript"> /* * 控制浏览器弹出一个警告框 * */ alert("这是我的第一个JS代码"); /* * 让计算机在页面中输出一个内容 * 网页就是一个文档document * */ document.write("你看我帅不帅"); /*作用就是向body标签中写一个内容*/ /* * 向控制台输出一个内容 * */ console.log("我是在控制台输出的!"); </script> </head> <body> </body> </html>
3.JS编写位置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 2.可以写在script标签中 --> <script type="text/javascript"> alert("写在script标签中"); </script> <!-- 3.可以将JS代码编写到外部JS文件中,然后通过script标签的src属性引入外部文件路径 写到外部文件中可以在不同的页面中同时引用,也可以利用到浏览器的缓存机制 推荐使用的方式 --> <script type="text/javascript" src="js/JS编写位置.js"> /*script标签一旦用于引入外部文件了,就不能在内部编写代码了,即使编写了浏览器也会忽略 * 如果需要编写内部代码,则可以再创建一个新的script标签用于编写内部代码 * */ alert("引入外部文件,内部编写代码会被忽略"); </script> </head> <body> <!-- 1.可以将JS代码编写到标签的onclick属性中 当点击按钮时,JS代码才会执行 虽然可以写在标签的属性中,但是他们属于结构与行为耦合,不方便维护,不推荐使用 --> <button onclick="alert('行内编写JS代码');">点我有惊喜</button> <!--可以将JS代码写在超链接的href属性中,这样当点击超链接时,会执行JS代码 必须先写 javascript:冒号后面写JS代码,JS代码后面不要忘记 ; 分号结束 --> <a href="javascript:alert('必须先写(javascript: ),再写JS代码');">链接</a> <!--也可以在冒号后不写JS代码,一个分号结束,这样点击超链接不会有效果,常用形式--> <a href="javascript:;">链接</a> </body> </html>
4.基本语法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> // 单行注释 /*多行注释*/ /* * 1.JS中严格区分大小写 * 2.JS中每条语句以分号(;)结尾 * - 如果不写分号结尾,浏览器会自动添加,但是会消耗一些系统资源。 * - 而且有些时候,浏览器会加错分号。所以开发中分号必须写 * 3.JS会自动忽略多个空格和换行,所以可以利用空格和换行对代码进行格式化操作 * * */ </script> </head> <body> </body> </html>
5.字面量和变量
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 字面量:都是一些不可改变的值 * 比如:1、3、6、"asd" * 字面量都可以直接使用:alert(12344556); * 但是我们一般不会直接使用字面量 * * * 变量:变量可以用来保存字面量,而且变量的值可以任意改变 * 开发中都是通过变量保存字面量,而很少直接使用字面量 * 可以通过变量对字面量进行描述(见名知意) * */ // 声明变量 // 在JS中使用var关键字来声明一个变量 var a; // 为变量赋值 a = 123; // 声明和赋值同时进行 var b = "adf"; </script> </head> <body> </body> </html>
6.标识符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 标识符: * - 在JS中所有可以由我们自主命名的都可以称为标识符 * - 例如:变量名、函数名、属性名 * * 命名一个标识符需要遵循规则: * - 标识符中可以含有字母、数字、_ 、$ * - 不能以数字开头 * - 不能是ES中的关键字或保留字 * - 标识符一般采用驼峰命名法 * * JS底层保存标识符时实际上是采用Unicode编码,理论上UTF-8中含有的内容都可以作为标识符 * - 但是最好不要用中文定义标识符 * */ </script> </head> <body> </body> </html>
7.数据类型
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 数据类型:指的是字面量的类型 * 在JS中一共有六种数据类型: * String 字符串 * Boolean 布尔值 * Null 空值 * Number 数值 * Undefined 未定义 * Object 对象 * * String、Number、Boolean、Null、Undefined 是基本数据类型 * Object 是引用数据类型 * */ </script> </head> <body> </body> </html>
1)字符串
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * String字符串:使用引号引起来 * 使用单双引号都可以,但不要混着用 * 引号嵌套:单引号内嵌双引号、双引号内嵌单引号 * */ var str = "javascript is good"; /* 字符串中使用\作为转义字符,当表示一些特殊符号可以使用\进行转义 \" -> " \' -> ' \n -> 换行 \t -> 制表符 \\ -> \ */ var stri = "hello\"World\""; </script> </head> <body> </body> </html>
2)Number
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * var 声明变量声明一次即可 * 第二次使用变量时不用再声明(不再写var关键字) * */ var str = "ad"; // 声明变量并赋值 // var str = "hello"; str = 1233; // 变量已经声明,不用再声明直接使用。 /* * 在JS中所有数值都是Number类型,包括整数和浮点数(小数 ) * * */ var num = 123; num = 123.456; var num2 = "123"; console.log(num); console.log(num2); // 控制台都打印"123",区分不出来谁是数值型,谁是字符串 /* * 使用一个运算符 typeof 来检查一个变量类型 * 语法:typeof 变量 * * */ console.log(typeof num); // 控制台结果:number console.log(typeof num2); // 控制台结果:string // JS中可以表示数字的最大值:Number.MAX_VALUE console.log(Number.MAX_VALUE); // 1.7976931348623157e+308 // JS中可以表示数字的最小值:Number.MIN_VALUE console.log(Number.MIN_VALUE); // 5e-324 大于0的最小值 // 如果使用Number表示的数字超过了最大值,则会返回一个Infinity(正无穷) console.log(Number.MAX_VALUE * Number.MAX_VALUE); // Infinity console.log(-Number.MAX_VALUE * Number.MAX_VALUE); // -Infinity (负无穷) num = Infinity; // num变量为正无穷,Infinity是字面量表示正无穷。 // NaN 是一个特殊的数字,表示Not A Number console.log("abc" * "def"); // 控制台结果:NaN // 使用typeof 检查一个NaN也会返回number num2 = NaN; console.log(typeof num2); // 控制台结果:number /* * 在JS中整数的运算基本可以保证精确 * */ var c = 123 + 456; console.log(c); /* * JS中进行浮点运算,可能得到一个不精确的结果 * 所以千万不要使用JS进行对精确度要求比较高的运算 * */ var d = 0.1 + 0.2; console.log(d); // 控制台结果:0.30000000000000004 </script> </head> <body> </body> </html>
3)布尔值
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * Boolean布尔值 * - true 真 * - false 假 * */ var bool = false; </script> </head> <body> </body> </html>
4)Null和Undefined
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * Null(空值)类型的值只有一个,就是null * null这个值专门用来表示一个为空的对象 * * 使用typeof检查一个null值时,会返回object * * */ var a = null; /* * Undefined(未定义)类型的值只有一个,就undefined * 当声明一个变量,但是并不给变量赋值时,它的值就是undefined * * 使用typeof检查一个undefined值时,会返回undefined * */ var b; console.log(typeof b); </script> </head> <body> </body> </html>
8.强制类型转换
1)String
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 强制类型转换 * - 指将一个数据类型强制转换为其他数据类型 * - 类型转换主要指,将其他的数据类型,转换为 String、Boolean、Number * */ /* * 将其他类型转换为String * 方式一:调用被转换数据类型的toString()方法, 调用什么方法就是xxx.方法() 。 * 该方法不会影响到原变量,它会将转换结果返回。 * * 注意:null和undefined这两个值没有toString()方法,否则报错。 * */ var a = "abcd"; var b = a.toString(); // 结果赋值给b变量 a = a.toString(); // 结果再赋值给自身 /* * 方式二:调用String()函数 ,并将被转换的数据作为参数传递给函数。 * - 调用什么函数就是 直接写什么函数。 * * 使用String()函数做强制类型转换时, * - 对于Number和Boolean实际上就是调用toString()方法 * - 但是对于null和undefined,就不会调用toString()方法 * 他会将null 直接转换为 "null" 字符串类型的null * 将undefined 直接转化为 "undefined" * * */ var c = "jkl"; var d = String(c); // 调用String()函数转换 console.log(typeof d); console.log(d); c = String(c); // 转换结果赋给自己 console.log(typeof c); console.log(c); </script> </head> <body> </body> </html>
2)Number
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 其他类型转换为Number * * 方式一:使用Number()函数 * * 1.字符串 转 Number: * 注意:1.如果是纯数字,则直接将其转换为Number类型 * 2.如果字符串中有非数字内容,则转换为NaN * 3.如果字符串是一个空串或者是一个全空格的字符串,则转换为0 * * 2.Boolean 转 Number: * true -> 1 * false -> 0 * * 3.null 转 Number: * null -> 0 * * 4.Undefined 转 Number: * undefined -> NaN * */ var a = "str"; var b = Number(a); // 转换结果赋给变量b // a = Number(a); // 结果赋给自己 var c = Number("123add"); // 结果为:NaN var d = Number(" "); // 结果为:0 // Boolean类型转换为Number var e = true; e = Number(e); // 结果为:1 var f = false; f = Number(f); // 结果为:0 /* * 方式二:专门用来处理字符串 parse /pɑːz/ 解析 * * - parseInt() 把一个字符串转换为一个整数 * 可以将一个字符串中有效的整数内容取出来(遇到第一个字母或其他字符,以后的字符都失效) * * - parseFloat() 把一个字符串转换为一个浮点数 * 与parseInt()类似,当遇到第一个点后面的数字依然有效,遇到字母或新的点,后面字符都失效 * * 如果对非String类型使用parseInt()、parseFloat(),它会先将其转换为String然后再操作 * */ var str = "123a13"; str = parseInt(str); //结果:123 var st = "a123456"; st = parseInt(st); // 结果:NaN var str1 = "123.123aaa"; str = parseFloat(str1); // 结果:123.123 var bool = true; bool = parseInt(bool); // 结果:NaN 先将true 转为 "true" 再转为 整数 var str2 = 123.556; str2 = parseInt(str2); // 结果:123 利用parseInt()对浮点数取整,并不会进行四舍五入 console.log(str2); // 应该是先将str2转换为字符串,转化为整数,遇到.后面失效了 </script> </head> <body> </body> </html>
3)Boolean
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 将其他类型转换为Boolean * - 使用Boolean()函数 * 数字 -> 布尔 : 除了0和NaN,其余都是true * * - 字符串 -> 布尔 : 除了空串,其余都是true(包括空格,空格也是字符) * * - null和undefined : 都转换为false * * - 对象也会转换为 true * * */ </script> </head> <body> </body> </html>
9.其他进制数字
<!DOCTYPE html> <!--suppress ALL --> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * JS中,如果需要表示16进制的数字,则需要以 0x 开头 * 需要表示8进制数字,以 0 开头 * 需要表示2进制数字,以 0b 开头,但不是所有浏览器都支持 * */ // 十六进制 var a = 0xff; // 255 // 八进制 var b = 070; // 56 console.log(b); // 二进制 var c = 0b10; // 2 console.log(c); // 字符串 // 像 "070" 这种字符串,有些浏览器会当成八进制,有些会当成十进制解析 var d = "070"; // 可以在parseInt中传递第二个参数,来指定数字的进制 d = parseInt(d, 8); </script> </head> <body> </body> </html>
10.运算符
1)算数运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 运算符也叫操作符,运算符都会返回结果。 * 通过运算符可以对一个或多个值进行运算,并获取运算结果。 * 比如:typeof就是运算符,可以获得一个值类型 * 它会将该值类型以字符串形式返回 * * 任何值与NaN运算结果都为NaN * */ /* * 算数运算符: * + : 对非Number类型的值进行运算时,会将这些值转换为Number,然后再运算。 * 如果对两个字符串进行加法运算,则会拼接,得到一个新的字符串,并返回。 * 任何数值与字符串进行加法运算,数字都会先转换为字符串,然后再拼接成新字符串 * * - : 两个值减法运算,返回结果。 * 如果一个数值减一个字符串,先将字符串转换为Number,然后再进行减法运算 * * * : 两个值乘法运算,返回结果。 * 如果一个数值乘一个字符串,先将字符串转换为Number,然后再进行乘法运算 * 数值乘undefined :undefined先转换为NaN,结果为NaN * * / : 两个值除法运算,返回结果。 * 如果一个数值除一个字符串,先将字符串转换为Number,然后再进行除法运算 * * % : 取模运算(取余) * * 对原变量不会产生影响 * * * 任何值做 - 、* 、/ 运算时都会自动转换为Number * 字符串通过为一个值 -0 、 *1 、 /1 ,将其转换为Number * 隐式转换为Number,原理和Number()函数一样 * */ var a = 123; var result; result = a + 1; // 124 result = true + false; // 1 result = 2 + null; // 2 null=0 // 任何值和NaN做运算,都得 NaN result = 2 + NaN; // NaN // 字符串拼接 result = "123" + "456"; // "123456" // 数值先转换为字符串,再拼接 result = 123 + "789"; // "123789" result = true + "hello"; // "truehello" // 隐式的类型转换,有浏览器自动完成,实际上也是调用String()函数 result = 128 + ""; // "128" result = 100 - "1"; // 99 先将字符串"1" 转换为数字 1 在进行运算 result = "2" * 3; // 6 console.log(result); </script> </head> <body> </body> </html>
2)一元运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 一元运算符,只需一个操作数 * + 正号 * 正号不会对数字产生任何影响 * -负号 * 负号对数字符号取反 * * 对于非Number类型的值: * 他会先转换为Number,然后运算 * 可以对其他类型使用 + ,将其转换为Number,原理与Number()函数一样 * * */ var a = -"18"; console.log(a); // 结果为 18 console.log(typeof a); // 类型是 number var b = 1 + +"2" + 3; console.log(b); // 结果为 6 console.log(typeof b); // 类型是 number </script> </head> <body> </body> </html>
3)自增、自减
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 自增:++ * 变量在自身基础上增加1 * 一个变量自增以后,原变量值会立即自增1 * a++ / ++a * * 自减:-- * 变量在自身基础上减1 * a-- / --a * */ var a = 1; a++; </script> </head> <body> </body> </html>
4)逻辑运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 三种逻辑运算符: * * && 与 :两值都为true才返回true * JS中&&是短路与 * * || 或 :两值都为false才返回false * JS中||是短路或 * * ! 非 :对非布尔值取反,先将值转变为布尔值,再取反 * */ // 布尔值的与 或 运算 var s = true; var t = false; var st = s && t; // false // 短路与 : 第一个参数为false,就不判断第二个参数是否为true,直接返回false st = t && s; console.log(st); st = s || t; // true // 短路或 : 第一个参数为true,就不判断第二个参数是否为true,直接返回true console.log(st); /* * 非布尔值的与 或 运算 * 先将其转换为布尔值,然后再运算,并且返回原值 * * 与运算:如果两个值都为true,则返回&&后面的值 * 如果两个值中有false,则返回小的值 * 例如 var ab = 2 && 0; 0小于2,返回0 * 如果第一个值为false,则直接返回第一个值 * 如果第一个值为true,则必然返回第二个值 * * 或运算:如果第一个值为true,则直接返回第一个值 * 如果第一个值为false,则直接返回第二个值 * */ var ad = 1 && 2; // 2 var ac = 0 && 2; // 0 var ab = 2 && 0; // 0 console.log("ab =" + ab); var str = "" || "hello"; // "hello" str = -1 || "world"; // -1 var a = false; var b = 1; var result = a && b; console.log(result); // false result = a || b; console.log(result); // 1 </script> </head> <body> </body> </html>
5)赋值运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 赋值运算符: = 将符号右侧值赋值给左侧变量 * * += :a += 1 => a = a+1 * -= : * *= : * /= : * %= : * */ </script> </head> <body> </body> </html>
6)关系运算符
注意:比较两个字符串型的数字,一定要转型(字符串是比较每一位字符的Unicode编码)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 关系运算符:比较两个值大小关系 * * > 大于号 :关系成立,返回true,不成立返回false * * >= : * < : * <= : * * 任何值与NaN比较都是false * * 对非数值进行比较是,先转换为数字,然后再比较 * 如果符号两侧的值都是字符串时,不会将其转换为数字进行比较,而是分别比较字符串中字符的Unicode编码 * * */ // 比较字符编码时会一位一位字符比较,同一位字母编码相同,比较下一位字符编码 var result = "abd" < "abc"; console.log(result); // 如果比较的两个字符串类型的数字,可能会得不到预期的结果。 // 注意:比较两个字符串型的数字,一定要转型 var mx = "12344353" < +"7"; // 对字符串"7"使用+(正号)转变为数值型进行比较 </script> </head> <body> </body> </html>
7)Unicode编码表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * Unicode编码 * 在字符串中使用转义字符输入Unicode编码 * \u四位编码 * */ console.log("\u2620"); </script> </head> <body> <!-- 在网页中使用Unicode编码 &#编码; 这里的编码需要是十进制 --> <h1 style="color: red">☠</h1> </body> </html>
8)相等运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 相等运算符:用来比较两个值是否相等 * 相等返回true,否则返回false * * 使用 == 做相等运算 * * 当使用== 来比较两个值时,如果值类型不同,则会自动类型转换,将其转换为相同类型,然后比较 * */ console.log(1 == "1"); // true /* * undefined 衍生自 null * 所以这两个值做相等判断时会返回true * */ console.log(undefined == null); // true /* * NaN 不和任何值相等 ,包括它本身 * */ console.log(NaN == NaN); // false /* * 通过函数isNaN()来判断一个值是否是NaN * */ console.log(isNaN(NaN)); // true /* * != : 不相等 * 不相等返回true,相等返回false * 不相等也会对变量进行类型转换,如果转换后相等,也会返回false * */ console.log(10 != "10"); // false /* * 全等 : === * 用来判断两个值是否全等,与相等类似,不同的是它不会做自动类型转换 * 如果两个值类型不同,直接返回false * */ console.log("123" === 123); // false /* * 不全等 : !== * 用来判断两个值是否不全等,与不等类似,不同的是它不会做自动类型转换 * 如果两个值类型不同,直接返回true * */ </script> </head> <body> </body> </html>
9)条件运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 条件运算符右称三元运算符 * 语法: * 条件表达式 ? 语句1 : 语句2 ; * */ var a = 10; var b = 20; // a > b ? alert("a大") : alert("b大"); // 获取最大值 var max = a > b ? a : b; console.log("max = " + max); </script> </head> <body> </body> </html>
10)运算符优先级
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 使用 , 分隔多个语句,一般可以在声明多个变量时使用 * */ var a,b,c; // 同时声明多个变量 a = 10; b = "10"; c = true; var d = 1, e = "2", f = false; // 同时声明多个变量并赋值 console.log(d); console.log(e); console.log(f); /* * 优先级: * 先乘除,后加减 * 优先级表查看 * */ </script> </head> <body> </body> </html>
11.代码块
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 代码块: * 程序是有一条一条语句构成 * 语句是按照自上向下的顺序一条一条执行的 * 在JS中,可以使用 {} 来为语句进行分组 * 同一个{}中语句我们称为是一组语句 * 他们要么都执行,要么都不执行 * 一个{}中的语句我们称为一个代码块 * 一个代码块后不用写 ; 结束 * * Js中代码块只有分组作用,没有其他用途 * */ { var a = "java"; alert("代码块"); console.log(123); document.write("厉害了,我的javascript!"); } console.log(a); // 代码块中内容,在外部完全可见 </script> </head> <body> </body> </html>
12.if语句
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 流程控制语句 * Js程序从上到下一行一行执行 * 通过流程控制语句可以控制程序执行流程,使程序可以根据一定条件选择执行 * * 语句分类: * 1.条件判断语句 * 2.条件分支语句 * 3.循环语句 * * 条件判断语句: * if语句: * 语法一: * if(表达式){ * * 语句; * } * * 语法二: * if(表达式){ * 语句1; * } else { * 语句2; * } * * */ if(true) { alert("if条件判断语句"); } /* * prompt("提示文字") * 可以弹出一个提示框,该提示框中会带有一个文本框,用户可以在文本框中输入一段内容, * 该函数需要一个字符串作为参数,该字符串将会作为提示框的提示文字。 * * 用户输入的内容将会作为函数的返回值返回,可以定义一个变量来接收该内容 * */ var str = prompt("请输入内容:"); alert(str); </script> </head> <body> </body> </html>
13.条件分支语句
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 条件分支语句也叫switch语句 * * 语法: * switch(条件表达式){ * case 表达式1: * 语句; * break; * case 表达式2: * 语句; * break; * ... * default: * 语句; * break; * } * */ </script> </head> <body> </body> </html>
14.while循环
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * 循环语句: * 通过循环语句,可以反复执行一段代码多次 * * while循环 * 语法: * while(条件表达式){ * 语句; // 循环体 * } * * do while()循环 * 语法: * do{ * 语句; * } while(条件表达式); * */ </script> </head> <body> </body> </html>
15.for循环
初始化表达式定义变量用 var 不能用int 等类型
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * for循环 * 语法: * for(初始化表达式;条件表达式;更新表达式){ * 语句; * } * * */ for (var i = 1; i < 10; i++) { console.log("i = " + i); } // 嵌套for循环 for (var i = 1; i < 10; i++) { for (var j = 1; j < 10; j++) { console.log("i = " + i + " j = " + j); } } </script> </head> <body> </body> </html>
16.break和continue
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> /* * break关键字可以用来退出switch或循环语句 * 不能在if语句中使用break和continue * break关键字,会立即终止离它最近的循环语句 * * */ var i = 1; while (true) { if (i == 10) { alert(i); break; } document.write(i+"<br/>"); i++; } /* * continue关键字可以用来跳过当此循环 * 同样continue也是默认只会对离它最近的循环起作用 * */ outer: // 标签 for (var i=0;i<5;i++) { for (var j= 0;j<5;j++) { continue outer; // 跳转到标签处 console.log("--->" + j); } } // 在程序执行之前,开启计时器 // console.time("计时器名字"),可以用开启一个计时器 // 它需要一个字符串作为参数,这个字符串将会作为计时器标识 console.time("test"); for (var i= 2;i<=10000;i++) { var flag = true; for (var j=2;j<i;j++) { if(i%j==0) { flag = false; break; } } if (flag) { console.log(i); } } // 终止计时器:console.timeEnd()用来停止一个计时器,需要一个计时器名字作为参数 console.timeEnd("test"); </script> </head> <body> </body> </html>
本文来自博客园,作者:Lz_蚂蚱,转载请注明原文链接:https://www.cnblogs.com/leizia/p/14552893.html
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步