大家好,小编来为大家解答以下问题,js中的方法是什么意思,js常用方法大全,今天让我们一起来看看吧!
js简介
前端三大件 html 超文本标记语言 结构层 也是一门语言 css 层叠样式表 样式层 JavaScript 轻量级弱类型的脚本语言 js三大核心 ES(ECMAScript) js 语法规范 我们要按照指定的语法进行开发 js这门语言就是一个工具 我们使用这个工具解决问题 ECMASCRIPT: 定义了java的语法规范,描述了语言的基本语法和数据类型 BOM (Browser Object Model): 浏览器对象模型 提供一整套操作浏览器的解决方法 DOM (Document Object Model): 文档对象模型 提供一整套文档流相关的属性和方法
vscode 常用快捷键
-
Ctrl + /
: 注释 -
Alt+B : 快速开启浏览器
-
复制 : shift + alt + ↓
-
移动 : alt + ↓
-
格式化代码规范 : shift + alt + F
-
折叠侧边栏 :
Ctrl + B
-
ctr + ` => 切换vscode终端
-
浏览器调出控制台
-
Ctrl+N
: 新建 -
Ctrl + C
: 复制 ( 光标在这一行即可) -
Ctrl + X
: 删除当前行 -
Ctrl+Z
撤销这一次操作 -
Ctrl+Shift+Z
: 反撤销
js应用位置行内
写在标签上的 js 代码需要依靠事件(行为)来触发
写在a标签上的href属性上 <a href="java:alert('我是一个弹出层');">点击</a> 写在其他元素上 <div οnclick="alert('我是一个弹出层')">点击</div> 注:onclick 是一个事件(点击事件),当点击元素的时候执行后面的 js 代码
内嵌式js代码
内嵌式的js代码会在页面打开的时候直接触发
在html页面书写一个标签,标签内部书写js代码 < type="text/java"> alert('我是一个弹出层') </> 注:标签可以放在head里面也可以放在body里面
外链式jS代码
外链式js代码只要引入了html页面,就会在页面打开的时候直接触发
新建一个.js后缀的文件,在文件内书写js代码,把写好的js文件引入html页面
我是index.js文件 alert('我是一个弹出层')
html文件 通过标签的src属性,把写好的js文件引入页面 < src="index.js"></> 一个页面可以引入多个js文件 < src="index1.js"></> < src="index2.js"></> < src="index3.js"></>
JS中的注释
学习一个语言,先学习一个语言的注释,因为注释是给我们自己看的,也是个开发人员看的
写一个好的注释,有利于我们以后阅读代码
单行注释
一般就是用来描述下面一行代码的作用
可以直接写两个/,也可以按Ctrl+/
// 单行注释 // 下面代码表示在浏览器里面出现一个弹出层 alert('弹出层')
多行注释
一般用来写一大段话,或者注释一段代码
可以直接写/**/然后再两个星号中间写注释。各个编辑器的快捷键不一样,vscode是ctrl+shift+a
/* 多行注释 */ /* 注释的代码不会执行 alert('弹出层') */ alert('弹出层')
JS输出的三种方式
<> alert(4333) //弹出弹框 console.log('hello.word') //控制台打印 遇到问题 使用console.log() 进行打印 如果能够出来结果说明 结果不在这里 如果不出来 说明错误出现在上面 document.write('东风吹战鼓擂当今世界谁怕谁') //在网页上显示 </>
变量
变量指的是在程序中保存数据的一个容器
变量是计算机内存中存储数据的标识符,根据变量名称可以获取到内存中存储的数据
也就是说,我们向内存中存储了一个数据,然后要给这个数据起一个名字,为了是我们以后再次找到他
语法: var 变量名 = 值
定义变量及赋值
// 定义一个变量 var num; // 给一个变量赋值 num = 100; // 定义一个变量的同时给其赋值 var num2 = 200;
注意:
-
一个变量名只能存储一个值
-
当再次给一个变量赋值的时候,前面一次的值就没有了
-
变量名称区分大小写(
JS
严格区分大小写)
变量的命名规则和命名规范
-
规则: 必须遵守的,不遵守就是错
-
一个变量名称可以由 数字、字母、英文下划线(_)、美元符号($) 组成
-
严格区分大小写
-
不能由数字开头
-
不能是 保留字 或者 关键字
-
不要出现空格
-
-
规范: 建议遵守的(开发者默认),不遵守不会报错
-
变量名尽量有意义(语义化)
-
遵循驼峰命名规则,由多个单词组成的时候,从第二个单词开始首字母大写
-
不要使用中文
-
<> // x = 8 // y = 8 // alert(x+y) // 给cpu 发送指令 算1+1 // alert(x+y) // alert(x+y) // alert(x+y) // alert(x+y) // 第一个需求 100 行代码 都是算2+2 alert(2+2) 这种写法有弊端 这属于写死 想改成8+8 100行都要改 // 如果想简单 //设置 x y 都是可变的量 // 第一次 x = 2 y =2 满足上面的需求 // 当我们想算8+8的时候 仅仅需要改 x = 8 y=8 即可 // 这里 x y 就是变量 // var x = 10; // 从右往左 // 规则 你必须遵守 // 规范 风格 可遵守可不遵守 // alert(x) // var 1abc = 1 // alert(1) // 只能包含 字母 数字 下划线 $ // 不能以数字开头 // var a = 10; // var A = 20; // alert(a); // 10 // 严格区分 大小写 // var = 100 // alert(var) // 避开关键字 和保留字 // 关键字 就是 已经被系统占用的 单词 保留字 就是虽然还没占用但是后边会占用 // 编辑器中高亮的 就是关键字 </>
数据类型
是指我们存储在内存中的数据的类型
我们通常分为两大类 基本数据类型 和 复杂数据类型
基本数据类型
-
数值类型(number)
-
一切数字都是数值类型(包括二进制0b,八 进制0o,十进制,十六进制0x等)
-
NaN
(not a number),一个非数字 -
console.log(0o77)
八进制
-
-
字符串类型(string)
-
被引号包裹的所有内容(可以是单引号也可以是双引号)
console.log('hello')
-
-
布尔类型(boolean)
-
只有两个(
true
或者false
)var test=true console.log('test')
-
-
null类型(null)
-
只有一个,就是
null
,表示空的意思var test = null; console.log(test)
-
-
undefined类型(undefined)
-
只有一个,就是
undefined
,表示没有值的意思
-
var test; 仅仅声明 但是没有赋值
var test
仅仅声明 但是没有赋值
console.log(test)
undefined
复杂数据类型
对象类型object
类 数组
函数类型function
函数 工具
判断数据类型
-
使用
typeof
关键字来进行判断 不是随便两个数据类型就能一起参与运算的
// 第一种使用方式 var n1 = 100; console.log(typeof n1); // 第二种使用方式 var s1 = 'abcdefg'; console.log(typeof(s1)); var test = 0xabc console.log(typeof test) // number 数值 如果返回的是number 代表这是一个 数值类型 var haha = 'abc' console.log(typeof haha) // string 字符 var haha1 = true console.log(typeof haha1) //boolean 布尔 var test1; console.log(typeof test1) //undefined undefined var test2 = null; console.log(typeof test2) //object null 是object 的一个特殊类型
判断一个变量是不是数字
-
可以使用
isNaN
这个方法来判断一个变量是不是数字 -
isNaN
:is not a number
// 如果变量是一个数字 var n1 = 100; console.log(isNaN(n1)); //=> false // 如果变量不是一个数字 var s1 = 'Jack' console.log(isNaN(s1)); //=> true
数据类型转换
数据类型之间的转换,比如数字转成字符串,字符串转成布尔,布尔转成数字等
其他数据类型转成数值
-
Number(变量)
可以把一个变量强制转换成数值类型
可以转换小数,会保留小数
可以转换布尔值
遇到不可转换的都会返回
NaN
-
parseInt(变量)
从第一位开始检查,是数字就转换,知道一个不是数字的内容
开头就不是数字,那么直接返回
NaN
不认识小数点,只能保留整数
-
parseFloat(变量)
从第一位开始检查,是数字就转换,知道一个不是数字的内容
开头就不是数字,那么直接返回
NaN
认识一次小数点
-
除了加法以外的数学运算
运算符两边都是可运算数字才行
如果运算符任何一遍不是一个可运算数字,那么就会返回
NaN
加法不可以用
<> //Number() 转换的内容当做一个整体来处理 // 如果可以转成一个合法数字 则转换成数字 // 如果不能转成一个合法的数字 则转换成NaN var num='123abc'; console.log(typeof(num)); var num1 = 'kangbazi'; console.log(typeof(num1)); var num2 = Number(num1); console.log(typeof(num2)); //parseInt() 转成整数 // 不管转换什么 都是一位一位的对待 'abc' // 如果第一位不能转成合法的数字 那么就立马输出 NaN 然后停止转换 // 如果第一位能转成合法的数字 那么保留第一位 然后继续看第二位 // 以此类推直到结束 不认小数点 true NaN false NaN var test = '123abc'; console.log(parseInt(test)) //parseFloat() // 也是以为一位的对待 同parseInt // 如果第一位不能转成合法的值 那么就立马输出 NaN 然后停止转换 // 如果第一位可以转换 那么保留第一位 继续下一位 // 识别小数点 var test = '123.45'; console.log(parseFloat(test));// 123.45 console.log(parseFloat('123.45abc'));// 123.45 console.log(parseFloat('abc123.45'));// NAN var test; console.log(parseFloat(test));// 123.45 console.log(parseFloat(null));//nan // isNaN() 只要带is的工具 结果不出意外一定是布尔类型 // 如果是NaN 则返回true 否则返回false console.log(isNaN(parseFloat('abc123.456')));// true console.log(isNaN(parseFloat('123.456abc')));// false console.log(parseFloat('abc123.4576')+100) // NaN console.log(NaN == NaN) // 结果一定是布尔类型 要么true 要么false </>
转换字符串
-
变量.toString()
有一些数据类型不能使用
toString()
方法,比如undefined
和null
-
String(变量)
所有数据类型都可以
-
使用加法运算
在 JS 里面,
+
由两个含义字符串拼接: 只要
+
任意一边是字符串,就会进行字符串拼接加法运算:只有
+
两边都是数字的时候,才会进行数学运算
<> //String() // 任何类型都可以使用这个转成字符串 // toString() // 不能转 undefined null var test; console.log(String(test)+100) console.log(String(null)+100) // + 除了相加 还有拼接的作用 //加法运算:只有 + 两边都是数字的时候,才会进行数学运算 console.log(typeof(1+1+'abc')) // 只要两边有一个字符串 那么就是拼接 // // 从左往右运算 2+'abc' 2abc console.log(typeof('abc'+1+1)) // 开始见到字符串 后边所有都是拼接 // // abc11 </>
转换成布尔
Boolean(变量)
在 js 中,只有
''
、0
、null
、undefined
、NaN
,这些是false
其余都是
true
<> //在 js 中,只有 ''、0、null、undefined、NaN,这些是 false 其余都是 true // 0 0.0 NaN "" '' false null undefined // 复杂数据类型 引用类型中 如果是空的 结果一定是false // 重点 后边判断 逻辑运算 都会用到 // 转字符串 转数值 转 布尔 上面的都是 明着转换 // 后边知识点 很多隐式转换 // 负无穷 是true console.log(Boolean("")) console.log(Boolean(" ")) </>
运算符
就是在代码里面进行运算的时候使用的符号,不光只是数学运算,我们在 js
里面还有很多的运算方式
数学运算符
-
+
只有符号两边都是数字的时候才会进行加法运算
只要符号任意一边是字符串类型,就会进行字符串拼接
-
-
会执行减法运算
会自动把两边都转换成数字进行运算
-
*
会执行乘法运算
会自动把两边都转换成数字进行运算
-
/
会执行除法运算
会自动把两边都转换成数字进行运算
-
%
会执行取余运算
会自动把两边都转换成数字进行运算
<> console.log(1+2) // 3 console.log(true+false) // 隐式转换 true1 false0 结果 1 console.log(1+1+'abc') // 2abc console.log('abc'+'def'+1+2+4) console.log(100/50) //2 console.log(100/0) // Infinity 分母为0 返回正无穷 console.log(100%3) //1 console.log(2**3) // 8 var num = 16789 h = parseInt(num/3600) // 小时 m = parseInt(num%3600/60) //分钟 s = parseInt(num%60) //秒 console.log(h,'时',m,'分',s,'秒') </>
赋值运算符
-
=
就是把
=
右边的赋值给等号左边的变量名var num = 100
就是把 100 赋值给 num 变量
那么 num 变量的值就是 100
-
+=
var a = 10; a += 10; console.log(a); //=> 20
a += 10
等价于a = a + 10
-
-=
var a = 10;
a -= 10; console.log(a); //=> 0
a -= 10
等价于a = a - 10
-
*=
var a = 10; a *= 10; console.log(a); //=> 100
a *= 10
等价于a = a * 10
-
/+
var a = 10; a /= 10; console.log(a); //=> 1
a /= 10
等价于a = a / 10
-
%=
var a = 10; a %= 10; console.log(a); //=> 0
a %= 10
等价于a = a % 10
<> // = 赋值 == 判断是否相等 var num = 100; console.log(num) // num = num + 100 // console.log(num) num += 100 // 等同于num = num+100 console.log(num) // 200 // -= num -= 100 // num = num -100 console.log(num) // 100 // *= num *= 5 // num = num * 5 console.log(num) // 500 // /= num /= 5 // num = num /5 console.log(num) // 100 // %= num %= 3 // num = num %3 console.log(num) //1 // **= num **=2 // num = num**2 console.log(num)//1 </>
比较运算符
-
==
-
比较符号两边的值是否相等,不管数据类型 >
1 == '1'
两个的值是一样的,所以得到
true
-
-
===
-
比较符号两边的值和数据类型是否都相等 >
1 === '1'
两个值虽然一样,但是因为数据类型不一样,所以得到
false
-
-
!=
-
比较符号两边的值是否不等 >
1 != '1'
因为两边的值是相等的,所以比较他们不等的时候得到
false
-
-
!==
-
比较符号两边的数据类型和值是否不等 >
1 !== '1'
因为两边的数据类型确实不一样,所以得到
true
-
-
>=
-
比较左边的值是否大于或等于右边的值 >
1 >= 1
结果是true
1 >= 0
结果是true
1 >= 2
结果是false
-
-
<=
-
比较左边的值是否小于或等于右边的值 >
1 <= 2
结果是true
1 <= 1
结果是true
1 <= 0
结果是false
-
-
>
-
比较左边的值是否大于右边的值 >
1 > 0
结果是true
1 > 1
结果是false
1 > 2
结果是false
-
-
<
-
比较左边的值是否小于右边的值 >
1 < 2
结果是true
1 < 1
结果是false
1 < 0
结果是false
-
<> console.log(1==1)// true console.log('1'==1) // true // // 两个= 仅仅是判断值是否相等 不判断类型 console.log('1'===1) // false === 判断值和类型是否都相等 console.log(1!='2') //判断值是否不相等 如果不相等 true 否则 false console.log(1!=='2')// 判断值和类型是否都不相等 是 返回给true 否则 false console.log(5>6) console.log(5>=6) console.log(5<6) console.log(5<=6) // 比较运算符 结果一定是布尔类型 // = 赋值 // == 值是否相等 // === 值和类型是否都相等 // console.log(NaN == NaN) // console.log(undefined == null) // true // // undefined 派生自 null // console.log(undefined === null) // false 因为类型不一致 console.log(1 == true) // true console.log(1 === true) // false 因为类型不一致 </>
逻辑运算符
-
&&
-
进行 且 的运算 >
符号左边必须为
true
并且右边也是true
,才会返回true
只要有一边不是
true
,那么就会返回false
true && true
结果是true
true && false
结果是false
false && true
结果是false
false && false
结果是false
-
-
||
-
进行 或 的运算 >
符号的左边为
true
或者右边为true
,都会返回true
只有两边都是
false
的时候才会返回false
true || true
结果是true
true || false
结果是true
false || true
结果是true
false || false
结果是false
-
-
!
-
进行 取反 运算 >
本身是
true
的,会变成false
本身是
false
的,会变成true
!true
结果是false
!false
结果是true
-
<> // 逻辑运算符的结果 不一定是布尔类型 // 逻辑与 && 两边都是true 结果才是true // 两边只要有一个是false 整个结果就是false var test1=true&&false&&true // 遇到false 停止向右走 console.log(test1) // 逻辑或 || 两边只要有一个是true 整个结果就是true // 两边都是false 整个结果就是false // 遇到true 停止向右判断 var test2=false||false||true console.log(test2) // 逻辑非 ! true-> false false-> true console.log(!true) </>
逻辑补充
<> var num = 123.456789; alert(num.toFixed(2)); //toFixed()保留几位小数 false || true && false false || false if(false && true || true && false){ console.log('true'); } else{ console.log('走到这里alse'); } //逻辑与 逻辑或在一起的 先执行逻辑与 alert(!(true) && true) //逻辑非 和逻辑与 在一起的时候 先 逻辑非 //逻辑非 ! > 逻辑与 &&> 逻辑或 || //== 值相等 === 值和类型 都相等 //Object.is(数据1,数据2) //判断两个数据是否一致 返回的是一个布尔类型的结果 alert(Object.is(1,'1')) // false alert(Object.is(1,1)) // true alert(undefined == null) // true alert(Object.is(undefined,null)) // false alert(Object.is(NaN,NaN)) // true 如果位true 说明两个数据一致 // false 不一致 </>
自减自增运算符
-
++
-
进行自增运算
-
分成两种,前置++ 和 后置++
-
前置++,会先把值自动 +1,在返回
var a = 10; console.log(++a); // 会返回 11,并且把 a 的值变成 11
-
后置++,会先把值返回,在自动+1
var a = 10; console.log(a++); // 会返回 10,然后把 a 的值变成 11
-
-
--
-
进行自减运算
-
分成两种,前置-- 和 后置--
-
和
++
运算符道理一样
-
<> var test=10 //++ 每次加一 console.log(++test) //11 // 前置 ++变量 会先把值自动 +1,在返回 console.log(++test) //12 // 后置 变量++ 会先把值返回,在自动+1 console.log('--------') console.log(test) //12 console.log(++test) //13 console.log(test++)//13 console.log(++test) //15 //--一样 console.log(--test) //14 console.log(--test) //13 console.log(test--) //13 console.log(--test) //11 console.log(--test) //10 console.log(test) var test1=test++ + ++test - --test + test-- +test console.log(test1) //32 </>
分支结构
if语句
-
通过一个
if
语句来决定代码是否执行 -
语法:
if (条件) { 要执行的代码 }
-
通过
()
里面的条件是否成立来决定{}
里面的代码是否执行// 条件为 true 的时候执行 {} 里面的代码 if (true) { alert('因为条件是 true,我会执行') } // 条件为 false 的时候不执行 {} 里面的代码 if (false) { alert('因为条件是 false,我不会执行') }
if else 语句
-
通过
if
条件来决定,执行哪一个{}
里面的代码 -
语法:
if (条件) { 条件为 true 的时候执行 } else { 条件为 false 的时候执行 }
-
两个
{}
内的代码一定有一个会执行// 条件为 true 的时候,会执行 if 后面的 {} if (true) { alert('因为条件是 true,我会执行') } else { alert('因为条件是 true,我不会执行') } // 条件为 false 的时候,会执行 else 后面的 {} if (false) { alert('因为条件为 false,我不会执行') } else { alert('因为条件为 false,我会执行') }
if else if ... 语句
-
可以通过
if
和else if
来设置多个条件进行判断 -
语法:
if (条件1) { 条件1为 true 的时候执行 } else if (条件2) { 条件2为 true 的时候执行 }
-
会从头开始依次判断条件
-
如果第一个条件为
true
了,那么就会执行后面的{}
里面的内容 -
如果第一个条件为
false
,那么就会判断第二个条件,依次类推
-
-
多个
{}
,只会有一个被执行,一旦有一个条件为true
了,后面的就不在判断了// 第一个条件为 true,第二个条件为 false,最终会打印 “我是代码段1” if (true) { alert('我是代码段1') } else if (false) { alert('我是代码段2') } // 第一个条件为 true,第二个条件为 true,最终会打印 “我是代码段1” // 因为只要前面有一个条件满足了,就不会继续判断了 if (true) { alert('我是代码段1') } else if (true) { alert('我是代码段2') } // 第一个条件为 false,第二个条件为 true,最终会打印 “我是代码段2” // 只有前一个条件为 false 的时候才会继续向后判断 if (false) { alert('我是代码段1') } else if (true) { alert('我是代码段2') } // 第一个条件为 false,第二个条件为 false,最终什么也不会发生 // 因为当所有条件都为 false 的时候,两个 {} 里面的代码都不会执行 if (false) { alert('我是代码段1') } else if (false) { alert('我是代码段2') }
if else if … else 语句
-
和之前的
if else if ...
基本一致,只不过是在所有条件都不满足的时候,执行最后else
后面的{}
// 第一个条件为 false,第二个条件为 false,最终会打印 “我是代码段3” // 只有前面所有的条件都不满足的时候会执行 else 后面的 {} 里面的代码 // 只要前面有一个条件满足了,那么后面的就都不会执行了 if (false) { alert('我是代码段1') } else if (false) { alert('我是代码段2') } else { alert('我是代码段3') }
三元运算符
-
三元运算,就是用 两个符号 组成一个语句
-
三元运算只是对 if else 语句的一个简写形式
-
语法:
条件 ? 条件为 true 的时候执行 : 条件为 false 的时候执行
var res=18 if(res==18){ console.log('成年') } else( console.log('未成年') ) res=>18?'成年':'未成年' console.log(res) res==18?console.log('成年'):console.log('未成年') var rom=parseFloat(prompt('请输入一个数')) if(rom==0){ console.log('你是男生') } else( console.log('你是女生') ) rom==0?console.log('你是男生'):console.log('你是女生')
分支嵌套
<> // 中国人 //成年人 //绿码 //红码 //未成年 //外国人 var rel=parseInt(prompt('请输入你是哪国人 0中国人 1外国人')); if(rel==0){ console.log('中国人'); var rel1=parseInt(prompt('是否成年 0成年 1未成年')); if(rel1==0){ console.log('成年人'); var rel2=parseInt(prompt('请出示你的健康码 1绿码 0红码')); if(rel2==1){ console.log('绿码'); } else{ console.log('红码'); } } else{ console.log('未成年'); } } else{ console.log('外国人'); } </>
switch分支结构
-
也是条件判断语句的一种
-
是对于某一个变量的判断
-
语法:
-
switch (要判断的变量) { case 情况1: 情况1要执行的代码 break case 情况2: 情况2要执行的代码 break case 情况3: 情况3要执行的代码 break default: 上述情况都不满足的时候执行的代码 }
switch(条件){ case 结果/情况方案: 执行语句; break; //阻断程序往下执行 // case 后边不能写 > //如果不写 就会继续穿透到下一个结果/情况 然后这个这个结果的代码 case 结果2/情况2: 执行语句2; break; default: //如果 switch 括号里边的结果 都不在下面的case中 // 那么就会走到 default 执行语句3; break; }
循环结构
-
循环结构,就是根据某些给出的条件,重复的执行同一段代码
-
循环必须要有某些固定的内容组成
-
初始化
-
条件判断
-
要执行的代码
-
自身改变
-
while循环
-
while
,中文叫 当…时,其实就是当条件满足时就执行代码,一旦不满足了就不执行了 -
语法
while (条件) { 满足条件就执行 }
-
因为满足条件就执行,所以我们写的时候一定要注意,就是设定一个边界值,不然就一直循环下去了
<> // 初始值 计数器 默认 0 // 判断条件 计数器 <= 10 // 执行的代码 跑步 // 计数器 计数器++ // 计数器 // while(条件判断){ // 条件满足的执行的代码; // 计数器++; // } var count=1 ; while(count<=10){ console.log('他跑了'+count+'圈') count++; } //只要while条件为true 循环就会执行 //死循环就是条件永远为true //我们在开发过程中 也会刻意制造死循环 while(true){ console.log('死循环') } //1-100所有偶数相加 var ser=0 var sem=0 while(ser<100){ ser+=2 sem+=ser console.log(sem) } </>
do while循环
do{ 执行的代码 } while(条件)
-
是一个和
while
循环类似的循环 -
while
会先进行条件判断,满足就执行,不满足直接就不执行了 -
但是
do while
循环是,先不管条件,先执行一回,然后在开始进行条件判断 -
语法:
do { 要执行的代码 } while (条件)
do { var password = prompt('请输入密码'); // 无论如何 一定会执行一次 }while(password != '123456'); // 如果密码不是123456 那就继续输入
for 循环
-
和
while
和do while
循环都不太一样的一种循环结构 -
道理是和其他两种一样的,都是循环执行代码的
-
语法:
for (var i = 0; i < 10; i++) { 要执行的代码 }
<> //1000-2022之间所有的润年 var ser=0 for(num=1000;num<=2022;num++){ if((num%4==0 && num%100!=0)||num%400==0){ ser=num document.write('<table border=1>') document.write('<tr>') document.write('<th>年份</th>') document.write('<th>是否是润年</th>') document.write('</tr>') document.write('<tr>') document.write('<td>'+ser+'</td>') document.write('<td>是</td>') document.write('</tr>') } } </>
循环嵌套
> //循环中再来个循环 //七列的矩形 for(var n=1;n<=7;n++){ for(var m=1;m<=7;m++){ document.write('*'+" ") } document.write('<br>') } </> <> //直角三角形 for(var n=0;n<9;n++){ //外面循环控制行 document.write(n) for(var m=0;m<n;m++){ //里面循环控制列 document.write('*'+" ") } document.write('<br>') } </> <> //等腰三角形 for(var a=1;a<=9;a++){ for(var b=9;b>=a;b--){ document.write(' ') } for(var c=1;c<=a;c++){ document.write('* ') } document.write('<br>') } </>
break 终止循环
-
在循环没有进行完毕的时候,因为我设置的条件满足,提前终止循环
-
比如:我要吃五个包子,吃到三个的时候,不能在吃了,我就停止吃包子这个事情
-
要终止循环,就可以直接使用
break
关键字
<> var i=0 while(i<100){ if(i==4){ break; //终止循环 } console.log(i) i++ } </> <> var i=0 while(i<100){ if(i==4){ i++ continue //跳过这次循环 继续下面的循环 } console.log(i) i++ } </>
CONTINUE 结束本次循环
-
在循环中,把循环的本次跳过去,继续执行后续的循环
-
比如:吃五个包子,到第三个的时候,第三个掉地下了,不吃了,跳过第三个,继续吃第四个和第五个
-
跳过本次循环,就可以使用
continue
关键字
函数
函数的概念
-
对于
js
来说,函数就是把任意一段代码放在一个 盒子 里面 -
在我想要让这段代码执行的时候,直接执行这个 盒子 里面的代码就行
-
先看一段代码
// 这个是我们以前写的一段代码 for (var i = 0; i < 10; i++) { console.log(i) } // 函数,这个 {} 就是那个 “盒子” function fn() { // 这个函数我们以前写的代码 for (var i = 0; i < 10; i++) { console.log(i) } }
函数的两个阶段(重点)
-
按照我们刚才的说法,两个阶段就是 放在盒子里面 和 让盒子里面的代码执行
函数定义阶段
-
定义阶段就是我们把代码 放在盒子里面
-
我们就要学习怎么 放进去,也就是书写一个函数
-
我们有两种定义方式 声明式 和 赋值式
声明式
-
使用
function
这个关键字来声明一个函数 -
语法:
<> //声明式 function story(){ document.write('一言之美,贵于千金.——葛洪') document.write('人无忠信,不可立于世.——程颐') document.write('诚信为⼈之本Python解释器的安装步骤。——鲁迅') document.write('⾔必信,⾏必果。——⼦路') }// function: 声明函数的关键字,表示接下来是一个函数了 // story: 函数的名字,我们自己定义的(遵循变量名的命名规则和命名规范) // (): 必须写,是用来放参数的位置(一会我们再聊) // {}: 就是我们用来放一段代码的位置(也就是我们刚才说的 “盒子”) </>
赋值式
-
其实就是和我们使用
var
关键字是一个道理了 -
首先使用
var
定义一个变量,把一个函数当作值直接赋值给这个变量就可以了 -
语法:
<> //赋值式 var storle=function(){ document.write('不信不⽴,不诚不⾏。——晁说之') document.write('读书贵精不贵多。——书摘') document.write('真诚是⼀种⼼灵的开放。——拉罗什富科') document.write('腹有诗书⽓⾃华,读书万卷始通神。——苏轼') }// 不需要在 function 后面书写函数的名字了,因为在前面已经有了 </>
函数调用阶段
-
就是让 盒子里面 的代码执行一下
-
让函数执行
-
两种定义函数的方式不同,但是调用函数的方式都以一样的
调用一个函数
-
函数调用就是直接写
函数名()
就可以了// 声明式函数 function fn() { console.log('我是 fn 函数') } // 调用函数 fn() // 赋值式函数 var fn2 = function () { console.log('我是 fn2 函数') } // 调用函数 fn()
-
注意: 定义完一个函数以后,如果没有函数调用,那么写在 {} 里面的代码没有意义,只有调用以后才会执行
-
调用上的区别
-
虽然两种定义方式的调用都是一样的,但是还是有一些区别的
-
声明式函数: 调用可以在 定义之前或者定义之后
-
// 可以调用 fn() // 声明式函数 function fn() { console.log('我是 fn 函数') } // 可以调用 fn()
-
赋值式函数: 调用只能在 定义之后
// 会报错 fn() // 赋值式函数 var fn = function () { console.log('我是 fn 函数') } // 可以调用 fn()
函数的参数(重点)
-
我们在定义函数和调用函数的时候都出现过
()
-
现在我们就来说一下这个
()
的作用 -
就是用来放参数的位置
-
参数分为两种 行参 和 实参
// 声明式 function fn(行参写在这里) { // 一段代码 } fn(实参写在这里) // 赋值式函数 var fn = function (行参写在这里) { // 一段代码 } fn(实参写在这里)
行参和实参的作用
-
行参
-
就是在函数内部可以使用的变量,在函数外部不能使用
-
每写一个单词,就相当于在函数内部定义了一个可以使用的变量(遵循变量名的命名规则和命名规范)
-
多个单词之间以
,
分隔// 书写一个参数 function fn(num) { // 在函数内部就可以使用 num 这个变量 } // 书写两个参数 function fun(num1, num2) { // 在函数内部就可以使用 num1 和 num2 这两个变量 }
-
如果只有行参的话,那么在函数内部使用的值个变量是没有值的,也就是
undefined
-
行参的值是在函数调用的时候由实参决定的
-
-
实参
-
在函数调用的时候给行参赋值的
-
也就是说,在调用的时候是给一个实际的内容的
function fn(num) { // 函数内部可以使用 num } // 这个函数的本次调用,书写的实参是 100 // 那么本次调用的时候函数内部的 num 就是 100 fn(100) // 这个函数的本次调用,书写的实参是 200 // 那么本次调用的时候函数内部的 num 就是 200 fn(200)
-
函数内部的行参的值,由函数调用的时候传递的实参决定
-
多个参数的时候,是按照顺序一一对应的
function fn(num1, num2) { // 函数内部可以使用 num1 和 num2 } // 函数本次调用的时候,书写的参数是 100 和 200 // 那么本次调用的时候,函数内部的 num1 就是 100,num2 就是 200 fn(100, 200)
-
参数个数的关系
-
行参比实参少
-
因为是按照顺序一一对应的
-
行参少就会拿不到实参给的值,所以在函数内部就没有办法用到这个值
-
行参比实参多
-
因为是按照顺序一一对应的
-
所以多出来的行参就是没有值的,就是
undefined
函数的return(重点)
-
return
返回的意思,其实就是给函数一个 返回值 和 终断函数
终断函数
-
当我开始执行函数以后,函数内部的代码就会从上到下的依次执行
-
必须要等到函数内的代码执行完毕
-
而
return
关键字就是可以在函数中间的位置停掉,让后面的代码不在继续执行
返回值
-
函数调用本身也是一个表达式,表达式就应该有一个值出现
-
现在的函数执行完毕之后,是不会有结果出现的
-
return
关键字就是可以给函数执行完毕一个结果function fn() { // 执行代码 return 100 } // 此时,fn() 这个表达式执行完毕之后就有结果出现了 console.log(fn()) // 100
-
我们可以在函数内部使用
return
关键把任何内容当作这个函数运行后的结果