web的组成
- html：网页的结构
- css：网页的样式
- js 网页的行为
浏览器的组成
- 浏览器的组成分为两部分：渲染引擎 和 js引擎
- 渲染引擎俗称浏览器内核，可以解析html和css
- js引擎：负责读取网页中的js代码
js的引入方式
- 行内式
将js直接写在html标签的开始标签上
- 非a标签
将少量的js代码写在标签的事件属性上（以on开头的属性）
<div id="123" style="color:red" onclick="alert('你好吗')">div</div>
- a标签
将js代码写在href属性里卖弄，当点击a标签的时候，就可以执行js语法了
<a href="javascript:alert('hello')">a标签</a>
不推荐，js和html耦合
- 内嵌式
在页面中使用script标签，在script标签体内写js代码
<script>
alert('我是js的内嵌式引入的')
</script>
不推荐，js和html部分分离
在练习的使用
- 外链式
使用script标签的src属性引入外在js文件
<script src="./001.js"></script>
推荐使用 js和html和css完全分离，可复用性高
script标签src引入的js文件后，script标签体内就不能写js代码，写了游览器也会自动忽略，如果需要可以另建一个script写
- script标签放置的位置
- script标签可以放在head标签内，也可以放在body标签内
- js执行特点：加载后马上执行
- 如果script写在head标签内，会先执行js文件在渲染后面html标签，这样就可能在js文件中获取html标签失败报错
- 先执行js文件再去渲染html标签，用户就需要等待js文件执行完毕才能看到页面，而且浏览器一次只能读取两个js文件
推荐将script标签（内嵌/外联）写在body标签的闭合标签的前面
js中的注释
// js中的单行注释 ctrl+/ 一次只能注释一行
/*
js中的多行注释 shift+alt+A 可以注释多行代码
*/
字面量
- 作用：字面都是一些不能改变的值，是用来表达一些固定值的表示方法 （固定不变的值，常量 1 2 3 4 5 6）
- 通俗讲：字面量就是所见即所得 当我们看到字面量的时候就知道他是什么 ，知道他是什么类型的数据，值是什么
- 比如：
数字字面量 1 2 3 16732
字符串字面量 '123sdrtgtr' "123" `123`
- 在js里面使用引号（单引号 双引号 反引号）括着的就是字符串
布尔值字面 true false
字面我们是可以直接用的，但是我们一般不会直接用
变量
变量就是在内存中开辟一个存储空间来存储数据，变量是在程序运行中保存一个中间值使用的， 变量就像一个盒子一样来存储字面量
- 声明变量（在内存中声明一个变量空间）
-
使用var 关键字声明变量
格式：var 变量名；
可以同时声明多个变量 var box,age,date; -
关键字：系统规定的有特殊作用的单词 var 作用：声明变量
保留字：现在没有特特殊作用，可能以后会有特殊作用，系统留用的单词 name
我们再声明变量的使用就不能使用关键字和保留字
标识符：我们为变量 函数 属性 参数 等所起的名字就是标识符 -
变量命名的规则 （必须遵守的，不遵守就会报错）
- 声明变量的使用就不能使用关键字和保留字
- 变量名只能有字母（a-zA-Z） 数字（0-9） 下划线（_） 美元符号($)组成
- 变量名不能以数字开头
- js中是严格区分大小的 （html里面没有区分大小写）
- 变量 box 和 Box 不是一个变量
- 变量命名的规范 (建议遵守的）
- 变量要做到见名知意，看到变量名就知道变量的用处，知道变量存储的是什么数据
- 多个单词组成的变量名，在命名的使用使用驼峰命名法
userNameCrrent
第一个单词首字母小写，后面所有单词的首字母都大写 - 不要使用中文
- 不要使用name作为变量名，name在系统有特殊的作用
- 变量赋值
使用赋值符号给变量赋值 = （赋值作用，不是等于的作用）
声明
var box;
赋值
box = 1673256723; 作用：将赋值符号右侧的值放到了box变量中
- 变量初始化
声明一个变量并赋值就是变量初始化，声明和赋值同时进行
var box1=1234;
- 使用变量：不是声明也不是赋值就是在使用变量
- 变量声明和赋值的情况总结
- 变量只声明不赋值的情况下，使用变量，返回结果是undefined
- 变量声明并赋值后使用变量，得到就是变量的赋值
- 变量不声明直接赋值时，变量可以正常使用 ，不报错，不推荐这样用，建议变量要先声明后使用
- 量声明 不赋值 直接使用的情况下会报错
- 建议
建议变量先声明后使用
更新变量 给变量从新赋值就是更新变量 变量其实就是用存储数据的盒子
更新变量后，变量中原来的值就找不回来
在使用变量的时候，注意变量不要加引号，加引号就是一个字符串不再是一个变量
- js里面的输出语句
- alert
- console.log(内容) 在浏览器的控制台中打印内容
<script>
*/
// console.log(1673256723)
// console.log(1673256723)
// console.log(1673256723)
// 声明变量
var box;
// 给变量赋值
box = 1673256723;
console.log(box);
var abcd;
console.log('---------------0001', abcd)
var _234;
var $412ty;
var userName = '小红';
var userAge = 18;
var userSex = '女';
var BOX;
// var var ;
// var 盒子;
// var name;
//同时声明了多个变量，在box3声明的同时并赋值
var box1, box2, box3 = 234;
/*
等同于
var box1；
var box2；
var box3=234;
*/
console.log(box1, box2, box3)
// 变量不声明直接赋值时，变量可以正常使用 ，不报错，不推荐这样用，建议变量要先声明后使用
box5 = 6666;
console.log(box5)
// 变量声明 不赋值 直接使用的情况下会报错
// console.log(box6)
//更新变量 给变量从新赋值就是更新变量 变量其实就是用存储数据的盒子
//更新变量后，变量中原来的值就找不回来
box3 = 789;
// 在使用变量的时候，注意变量不要加引号，加引号就是一个字符串不再是一个变量
console.log('更改后的box3', 'box3', box3)
</script>
js中的输入输出语句
-
console.log(要输出的内容) 在浏览器控制台打印数据
-
alert(提示信息) 在浏览器中弹出提示框,有确定按钮，用户点击确定后该语句才结束 alert操作的返回值 是 undefined
-
confirm(需要用户确认的信息) 确认信息弹出框 有确认和取消两个按钮
当用户点击确定按钮后 返回值是 true 当用户点击取消的时候 返回值 false -
输入框
prompt(提示信息); 会弹出一个带输入框的提示框，需要用户输入，并有确认和取消两个按钮
当用户点击确认按钮后会将用户输入的信息以字符串的形式打印出来，如果用户没有输入则打印出来的是一个空字符串
用户点击取消按钮的时候 返回值 null -
documet.write() 向body标签中写入内容，直接把内容写在html页面上
document.write(‘我是段落
’)
可以解析html标签，在页面中可以展示为一个段落标签实例：
数据分类-基本数据类型
- 基本数据类型
- 数值 1 2 3 4
- 字符串 ‘123’ ‘true’
- 布尔值 true false
- undefined 未定义 变量只声明没有赋值时，变量默认值就是undefined
- null 表示一个空值
数值型 Number
- 数值型 Number
-
一切的十进制都是数值型的数据 1 2 3 4 123 456
10进制 0~9 逢10进1 -
其他的进制表示的数值
常用的进制 2 8 16 -
二进制
0~1 逢2进1 0101010111 计算机在存储数据的时候使用2进制，计算机语言
js中2进制的数值前面加0b 0b11 -
八进制
0~7 逢8进1 0 1 2 3 4 5 6 7
在js里8进制的数字前面加0
八进制的010对应的就是10进制里的8 -
16进制
0~9abcdef 逢16进1
js中16进制的数字在前面0x -
一切浮点数 （小数）
3.4 -
科学计算法
有一些数字不好直接表示 可以使用科学计算法表示
π 3.141592653579…
2e5 表示的是 2*10的5次方 -
特殊数值
NaN 数值类型里面的非数字
Infinity 正无穷 无穷大
-Infinity 负无穷 无穷小 -
数字型的范围
js中数值的最大值和最小值
Number.MAX_VALUENumber.MIN_VALUE
-
实例：
<script>
// 在控制台中打印出来的数值都是10进制
console.log(11)
console.log(0b11);//二进制的11，在控制台打印出来的时候显示的是对应的10进制的值3
// ----8进制
console.log(10)
console.log(010); // 八进制的010对应的就是10进制里的8
// ----16进制
console.log(19)
console.log(0x19);//16进制里的19对应的是10进制里面25
console.log(0x1a);//对应的是10进制里面26
console.log(0x20);//对应的是10进制里面32
console.log(0x4e);//16*4+e(14) 对应的是10进制里面78
// typeof的作用是检测数据类型， 返回值 以字符串的形式来告诉我们要检测的数据是什么类型的
console.log(typeof 2e5);//'number'
console.log(typeof 0x23);
console.log(Infinity);
console.log(typeof -Infinity);//'number'
console.log(typeof NaN);//'number'
console.log(Number.MAX_VALUE)
console.log(Number.MIN_VALUE)
</script>
字符串 String
-
字符串的字面量 ‘12345’ “” ``
-
在js中使用引号包围的文本就是字符串 引号可以是 单引号 双引号 反引号
-
在html标签中使用的是 双引号，所以推荐在js中使用单引号
-
字符串在嵌套的时候：外单内双 外双内单
-
字符串是由一个一个的字符串连起来
-
判断字符串的长度 字符串.length 返回值就是 字符串中字符的个数
-
在字符串中空格也是占位的，也算一个字符
-字符串中的转义字符
-转义字符的作用，就是将没有意义的专为有意义的，将有意义的转为没有意义的- 在字符串中想要表示一些特殊的字符是没有办法直接表示出来的，需要使用转义字符,转义字符是以斜杠\开头的
\n 在字符串中换行 newline
\t 在字符串表示缩进
\
制表符 tab键的缩进
tab键这个按钮是要达到缩进目的（空出来空间）
当我们按下tab按钮的时候，表示方式有多个 tab缩进（制表符 ->） ；使用空格缩进 （…） - 在字符串中想要表示一些特殊的字符是没有办法直接表示出来的，需要使用转义字符,转义字符是以斜杠\开头的
实例：
<script>
var box01 = '你好"北"ewrt"京"';
console.log(box01.length);//12
console.log('123'.length);//3
console.log('');//0
console.log(' ');//1
console.log('123 412'.length);//7
// 转义字符
console.log('235\n326')
console.log(' 235326');
console.log(' 2353 26');
console.log(' 23 5326');
console.log('23432465');
console.log('\t23432465');
console.log('\nmf');//n本身是一个没有意义的东西 \会把n变为有意义的 换行
// s本身是一个没有意义的东西 \会把s变为有意义的 但是s变为的有意义的后，确实没有什么特殊作用，那就还是一个s
console.log('sfg\sdf');
// 斜杠本身是有意义的（转义用的） 前面的\就会把后面的斜杠为为没有意义的东西
console.log('asdf\\s')
</script>
布尔值
-
布尔值数据类型里面只要两个值 true false
- true表示真 肯定在 计算机中存储的就是1
- false 表示假 否定 计算机中存储的就是1
-
布尔值在数值进行计算的时候 转为数值
true–》1
false–》0js属于弱类型的语言
变量对存储的数据类型没有要求 -
数据类型转换
- 强制转换（显示转换）
- 自动类型转换（隐式转换）
运算符对参与运算子有数据类型的要求，一旦发现云算子不是自己想要的数据类型就会发生数据类型转换
实例：
<script>
console.log(false - 1);//-1
console.log(true - 1);//0
console.log(true * 1);//1
console.log(true + '1');//'true1'
</script>
udnefined和null
- udnefined 和 null 都是没有或者空的含义
- 这两个数据数据类型含义是一样
- 在最初只用一个null，因为null在参与运算的时候转为数值是0，不容易发现错误而，所以又创建了undefined，undefined转为数值为NaN，我们可以发现错误
- null表示空值 真正空值 即 null—》0
- ndefined 表示未定义 即 undefined转为数值 NaN
实例：
<script>
var box01 = null;//18 20 888 889 0
console.log(box01 - 1);//0-1-->-1
console.log('undefined' + 1);
console.log(undefined + 1);//NaN
console.log(undefined + true);//NaN
console.log('null' + 1);//'null1'
console.log(null + 1);//1
console.log(null + true);//
</script>
验证数据类型–typeof
- 作用：typeof运算符可以返回一个值的数据类型。判断给定的数据或者变量的数据类型，返回值 是以字符串的形式告诉我们要检测的数据的数据类型
- 格式1：typeof 要检测的数据 只会检测后面紧挨着的哪一个数据的数据类型
- 格式2：typeof (要检测的数据) 先运算小括号里的结果，然后再检册结果的数据类型
- 返回值：typeof 返回值是一个字符串，当两个及以上的typeof连用的时候一定会得到’string’
实例：
<script>
// var res1 = typeof 122;
var res1 = typeof '122';
console.log(res1);//'number'
var a = 100, b = 200;
var res2 = typeof a + b;//'number'+b 'number200'
console.log(res2);//'number200'
console.log('--------', typeof (a + b));//'number'
//
console.log(typeof typeof typeof b);//typeof b---->'number'
// typeof 'number'; ---> 'string'
//先执行右侧的typeof ，得到结果后再执行左侧的typeof
// typeof只能准确的检册基本数据类型的数据
console.log(typeof 123);//'number'
console.log(typeof '123');//'string'
console.log(typeof true);//'boolean'
console.log(typeof undefined);//'undefined'
console.log(typeof null);//'object'
console.log(typeof []);//'object'
console.log(typeof {});//'object'
</script>
数据类型转换
-
强制转换（显示转换） （通过js提供的方法转换，人为操作的转换）
- 使用js提供的 Number(要转换的数据) String(要转换的数据) Boolean(要转换的数据)这三个方法将其他数据类型 的值转为他所对应的数值 ，字符串，布尔值
-
自动转换（隐式转换）
- js是一种弱类型语言，变量对存储的数据类型没有要求，但是运算符号对参与运算的运算子有类型的要，一旦发现参与运算的运算子不是想要的数据类型，就会发生自动的数据类型转换
+ - * / %(相当于除法，要除法操作之后的余数)
- js是一种弱类型语言，变量对存储的数据类型没有要求，但是运算符号对参与运算的运算子有类型的要，一旦发现参与运算的运算子不是想要的数据类型，就会发生自动的数据类型转换
-
运算符号根据参与运算的云算子个数不同分类
一元运算符 2 取正 取负 +2 -2
二元运算符 + - * / %
三元运算符 ?:
将其他数据转为字符串
-
强制转换
- 方式1：你要转换的数据.toStrign()
null和undedifned不能使用toString方法转为字符串
- 方式2： String(你要转换的数据)
可以将所有任意类型的数据转为其所对应的字符串
- 方式1：你要转换的数据.toStrign()
-
自动转换
-
使用加号 实现字符串的拼接
-
‘123’+888 加号此时执行字符串拼接操作，会先将不是字符串的哪一个数据自动转为字符串后再进行字符串拼接
-
实例：
<script>
// 自动转换 隐式转换 运算符对参与运算的运算子有数据类型的要求
console.log('234' * 2);
// ----转为字符串
//你要转换的数据.toStrign()
// var num1 = 2345;
// var num1 = 'undefined';
var num1 = true;
// 点运算符 在js中点前面和后面不要直接跟数值 js分不清这个点是小数点还是点运算
// console.log(2345.toString());
console.log(num1.toString(), 23456);//'2345'
// ----String(数据)
console.log(String(123));//'123'
console.log(String('123'));//'123'
console.log(String(false));//'false'
console.log(String(undefined));//'undefiend'
console.log(String(null));//'null'
</script>
将其他数据转为布尔值
-
强制转换
boolean(要转换类型的数据)
可以将其他所有类型的数据转为布尔值
返回值：转换后的布尔值 （true false）
规则：
在js中所有表示 空 否定的值（null undefined 0 NaN ‘’ false）转为布尔值的时候都是转为false，其他的都是转为true -
自动转换（js预期没布尔值的地方只要不是预期值就会发生自动类型转换）
取反 ! （一元运算符）会将数据转为其所对应的布尔值的相反的布尔值
实例：
<script>
console.log(Boolean(false));//false
console.log(Boolean(0))//false
console.log(Boolean(NaN));//false
console.log(Boolean(''));//false
console.log(Boolean(null));//false
console.log(Boolean(undefined));//false
// ----除了以上6个值转为布尔值是false，其他的值转为布尔值都是true
console.log(Boolean(' '));//true
console.log(Boolean('234asddfgyg'));//true
console.log(Boolean('0'));//true
// ----取反！
console.log('------');
console.log(!true);//false
console.log(!false);//true
console.log(!2);//fasle
console.log(!NaN);//true
// 双取反 !! 得到后面数据所对应的布尔值
console.log('------!!');
console.log(!!true);//true
console.log(!!false);//false
console.log(!!2);//true
console.log(!!NaN);//false
</script>
将其他数据类型转为数值（重点）
-
强制转换
- Number(要转换类型的数据) 返回值：转换后的数值， 可以将其他所有类型的数据转为所对应的数值
- 转换规则：
将你想要转换的数据当做一个整体来看待，如果这个整体可以转为数值就转为数值，如果这个整体不能转为数值则转为NaN（数值类型的数据，表示非数字）-
parseInt(‘要转换类型的数据’)
作用：用来解析字符串，parseInt这个方式的返回值是一个整数
转换规则：将你要转换的数据一位一位看，先看第一位如果不能转为数值则直接返回NaN
,如果第一个可以转为数值则保留，继续看后一位是否可以转为数值，直到遇到第一个不能转为数值的那一位为止parseInt开头和结尾的空格是允许的
console.log(parseInt(’ 88 99’));//88 -
parseFloat(‘要转换类型的数据’)
和parseInt的区别就是，parsrint不认识小数点，parseFloat认识小数点
-
- Number(要转换类型的数据) 返回值：转换后的数值， 可以将其他所有类型的数据转为所对应的数值
-
自动转换
运算符号除了加号可能执行字符串拼接的操作（会将其他类型的数据转为字符串），其他的非加号（- * / %）运算符号都是将其他类型的数据转为数值，执行自动类型转换但是符号Number执行强制转换的规则，自动类型转换将其他数据转为数值将数据看做一个整体，这个整体可以转换数值就转，整体不能转为数值则转为数值类型的NaN
实例：
<script>
console.log(Number(123));//123
console.log(Number('123'));//123
console.log(Number(true));//1
console.log(Number(false));//0
console.log(Number(NaN));//NaN
console.log(Number(undefined));//NaN
console.log(Number(null));//0
console.log(Number('123abc'));//NaN
// -----parsreInt（）
console.log(parseInt('123a1bc'));//123
console.log(parseInt('a123a1bc'));//NaN
console.log(parseInt('88.99'));//88
console.log(parseInt('88 99'));//88
// parseInt开头和结尾的空格是允许的
console.log(parseInt(' 88 99'));//88
console.log(parseFloat('88.99'));//88.99
console.log(parseFloat('88.99se'));//88.99
console.log(parseFloat('88.w99se'));//88
// ---------- 自动类型转换
console.log('5' - '2');//3
console.log('5' * '2');//10
console.log('5' / '2');//2.5
console.log('5' % '2');//1
console.log('4' % '2');//0
console.log(true - 1);//0
console.log(false - 1);//-1
console.log(null - 1);//-1
console.log(undefined - 1);//NaN
console.log('4a' % '2');//NaN
// 一元运算符 取正 和 取负也会将其他类型的数据转为数值
console.log(-2);
console.log(-'abc');//NaN
console.log(+true);//1
console.log(-true);//-1
</script>
练习题： 把一个4位数拆分成一位一位的
<script>
// var num = 2345;
var num = 6764;
var a, b, c, d;
a = parseInt(num / 1000); // 2.345 -->2
// b = parseInt((num - a * 1000) / 100); //3.45
b = parseInt(num % 1000 / 100); //3.45
c = parseInt(num % 100 / 10);//4.5 ---> 4
d = num % 10;//5
console.log('-------', a, b, c, d);
</script>
自增自减运算符
++ 自增，一元运算符
作用：和变量配合使用，可以使变量加一
前置自增： 自增运算符在变量的前面
后置自增: 自增运算符在变量的后面
前置自增和后置自增单独运行的时候结果是一样，给变量加一
但是前置自增和后置自增和其他的变量或者数值进行运算的时候效果就不一样了
前置自增：变量先自增返回自增后的变量再参与运算 （先自增后运算。先己后人）
后置自增：变量先返回原值参与运算后再自增（先参与运算，后自增 先人后己）
自减运算 –
作用：和变量配合使用，是变量减一
前置自减 --变量 先自减再使用自减后的结果参与运算
后置自减 变量-- 先使用原值参与运算再自减
实例：
<script>
console.log(b++ + 1);//2
console.log('-------------------');
var c = 1;
// console.log('前置自增的返回值', ++c); //2
// console.log('前置自增后的变量c', c); //2
// c++;
console.log('后置自增的返回值', c++);//1
console.log('后置自增后的变量c', c); //2
var num01 = 1;
// console.log(++num01 + 2);//2+2 -->4
// console.log(num01++ + 2);//1 + 2 -->3
// console.log(num01);//2
console.log(++num01 + 2);//4 num01->2
console.log(num01++ + 2);//2+2 -->4 num01-->3
console.log(num01);//3
console.log('--------------------------');
var box1 = 10, box2 = 20;
/*
box1
自身 11
运算 11
box2
自身 21
运算 20
*/
console.log(++box1 + box2++);// 11 + 20 ---》31
/*
box1
自身 12
运算 11
box2
自身 22
运算 22
*/
console.log(box1++ + ++box2);//11+22 33
var n = 5;
/*
n 6 7 8 9
运算 5 7 8 8
*/
// var res = n++ + ++n + ++n + n++;
/*
n 6 7 8 9 10
运算 6 6 8 8 10
*/
var res = ++n + n++ + ++n + n++ + ++n;
console.log(res, '------', n)
var m = 6;
++m;
// 变量加一，推荐使用前置自增
m++;
</script>
比较运算符
- 比较运算符就是 两个数据进行比较时使用的运算符,返回值是一个布尔值
大于号 > 小于号 < >= <= ==等于 === 全等 - == 等于 只要求值相等，不管数据类型是否一样
会发生自动类型转换，会将其他类型的数据转为数值，再进行比较是否相等 - != 不等于 不考虑数据类型，只看值是否不等
- === 全等 作用：判断左右两侧的值是否全等，要求左右两侧的值一样，数据类型也要一样
- !== 不全等 比较左右两侧数据是否不等，值和数据都要比较，当数据类型不一样 则返回true
实例：
<script>
console.log(10 < 20);//true
console.log(10 > 20);//false
console.log(10 > 10);//false
console.log(10 >= 10);//true
// console.log(10 = 10);// = 赋值符号 作用：将赋值符号右侧的值赋值给左侧
console.log(10 == 10);//true == 等于 会发生自动类型转换，会将其他类型的数据转为数值，再进行比较是否相等
console.log('10' == 10);//true
console.log('1' == true);//1 == 1 -->true
console.log('1' == 1);//true
console.log('' == 0);//0 == 0 -->true
console.log(null == undefined);//0 == NaN --->** true **
console.log(NaN == NaN);//** false ** NaN和其他任何数据进行计算的时候返回值都是NaN ，NaN是唯一一个和自身都不相等的数据
//----------------- === 全等
console.log('------------------------------------')
console.log(10 === 10);//true
console.log('10' === 10);//false
console.log('1' === true);//false
console.log('1' === 1);//false
console.log('' === 0);//false
console.log(null === undefined);//false
console.log(NaN === NaN);//false
console.log('------------------------------------')
console.log(10 != 10);//fasle
console.log('10' != 10);//false
console.log('1' != true);//false
console.log('1' != 1);//false
console.log('' != 0);//false
console.log(null != undefined);//false
console.log(NaN != NaN);//true
console.log('------------------------------------')
console.log(10 !== 10);//false
console.log('10' !== 10);//true
console.log('1' !== true);//true
console.log('1' !== 1);//true
console.log('' !== 0);//true
console.log(null !== undefined);//true
console.log(NaN !== NaN);//true
</script>
逻辑运算符
-
作用：对数据进行逻辑运算
-
布尔运算符 用于将表达式转为布尔值,运算子预期值为布尔值
或 || 且 && 非 ! 三元运算符 ?: -
非 （取反运算符） !
-
且 && 表示 和，与的意思
-
格式： 表达式1 && 表达式2
-
原来的思维 (为了方便理解)
左右两侧都是直接的布尔值的情况下，左右两侧都是true的时候则返回true，只有有一个是false则返回false -
规则：
如果第一个运算子的布尔值为true，则返回第二个运算子的值（注意是值，不是布尔值）
如果第一个运算子的布尔值为false，则直接返回第一个运算子的值，且不再对第二个运算子求值 -
逻辑与：
左右两侧都是true则为true，当第一个运算子对应的布尔值为true，逻辑与的结果由第二个运算子决定，则直接返回第二个运算子的值（而不是隐式转换后的布尔值）
当第一个云算子对应的布尔值为false，则直接返回第一个运算子的值（而不是隐式转换后的布尔值），第二个运算子是什么不重要，不再对第二个运算子求值 -
逻辑或 ||
两侧都是直接布尔值的规则
两侧只有有一侧是true则为true，两侧都为false的时候才为false
true || true --》true
true || false -->true
false || true -->true
规则：
第一个运算子对应的布尔值为true，则直接返回第一个运算子的值，不再对第二个运算子求值 (逻辑短路)
第一个运算子对应的布尔值为false，则直接返回第二个运算子的值（不是隐式转换后的布尔值）
实例：
-
<script>
console.log(true && true);//true
console.log(false && true);//fasle
console.log(true && false);//fasle
console.log(3 > 2 && 2 < 4);//true && true --->true
console.log(3 > 2 && 2 > 4);//true && false --->false
console.log(3 - 1 && '2');//2 && '2' --> '2'
console.log(3 - 1 && 3 * 2);//6
console.log(3 && 3 % 2);//1
console.log(3 - 3 && '2');//0 && '2' -->0
console.log(NaN && '2');//NaN
console.log(NaN == NaN && '2');//false && '2' -->false
var x = 1;
// var res = 3 - 3 && x++;
var res = 3 - 3 && ++x;
console.log(res, '----', x);//0 1
/*
逻辑短路:多个表达式，当左侧的表达式就可以确定结果的时候，就不再继续运算右侧表达式的值了，就形成了逻辑短路
*/
console.log('t' && 1 + 2);
console.log(3 - 3 || 5 + 8);//13
console.log(NaN || 0 - 1);//-1
console.log(1 >= '0' || '8');//true
console.log(1 - '0' || '8');//1
var x = 10;
console.log(3 - 2 || x++);//1
console.log(3 - 2 || x * 10);//1
console.log(x);//10
/*
三元运算符
?:
格式：表达式1？表达式2:表达式3
规则：表达式1对应的布尔值为true则返回第二个表达式的值,如果：表达式1对应的布尔值为false则返回第三个表达式的值
*/
console.log(1 ? 2 : 3);//2
console.log(0 ? 2 : 3);//3
console.log(0 || 1 ? 2 + 3 : 3 + 3);//5
console.log(0 && 1 ? 2 + 3 : 3 + 3);//6
7 - 2 || 5 - 5 ? console.log('你好') : console.log('加油');
</script>
赋值运算符
- js中的赋值
= 赋值符号
+= -= *= /= %=
将变量自身 加/减/乘/除/取余 一个数后再赋值给变量自身
实例：
<script>
var a = 10;
// a = a + 10;
a += 10;
//等同于 a = a + 10; a--->20
a -= 5;
// a = a - 5; b a--->15
a *= 2;
// a = a * 2; a--->30
a /= 3;
// a=a /3; a--->10
a %= 3;
// a=a%3; a--->1
console.log(a)
// 逗号运算符
var res1 = ('a', 'b');
console.log(res1);
// 逗号运算符： 会对两个表达式都求值，返回后一个表达式的结果
// var x = 0;
// var y = (x++, 10 + 2); //(0,12) --->12
// console.log(x, y);//1 12
var x = 0;
var y = (x = 10 + 2, x + 1); //
console.log(x, y);//12 13
// 右结合的运算符 赋值符号（=） 取幂（**） 三元运算符 （?:）
var w, x, y, z = 2;
w = x = y = z;
console.log(w, x, y, z);
console.log(2 ** 3 ** 2)
console.log(2 ** 9)
console.log(0 ? 2 : (3 ? 4 : 5));
</script>
流程控制
- 流程控制语句就是控制我们所写的代码按照什么结构顺序执行，执行顺序决定了执行的结果
- 顺序结构
按照代码书写的顺序从上往下依次执行 - 分支结构
根据不同的条件，让代码走不同的路径-
if 语句
格式1：
if(条件表达式){
当条件表达式成立的时候执行的代码
}
当条件表达式成立则执行{}里面的代码，不成里则不执行
条件表达式的预期值是一个布尔值 -
if else 双分支语句 （2选1）
格式：
if (条件表达式) {
条件表达式成立时执行的代码
} else {
条件表达式不成立时执行的代码
} -
if else if 多分支语句 （多选1） else语句不是必须， else if 语句可以有任意多个
格式1：
if (条件表达式1) {
条件表达式1成立时执行的代码-- - 1
} else if (条件表达式2) {
条件表达式2成立时执行的代码-- - 2
} else {
条件表达式2不成立时执行的代码-- - 3
}格式2：
if (条件表达式1) {
条件表达式1成立时执行的代码-- - 1
} else if (条件表达式2) {
条件表达式2成立时执行的代码-- - 2
}else if(条件表达式3){
条件表达式2成立时执行的代码-- - 2
}else if(…){
}
-
实例：
<script>
// 顺序结构
var a = 1;
console.log(a)
console.log(123)
// if语句
if (0 || 3) {
console.log('我被执行了');
}
console.log(44444);
// if else 双分支语句
// if (8 - 8) {
// console.log('条件成立');
// } else {
// console.log('条件bu----成立');
// }
// if else if 多分支语句
if (8 - 8) {
console.log('条件成立');
} else if (0) {
console.log('条件2成立');
} else if (3) {
console.log('条件3成立')
}
// if (条件表达式1) {
// 条件表达式1成立时执行的代码-- - 1
// } else if (条件表达式2) {
// 条件表达式2成立时执行的代码-- - 2
// } else if (条件表达式3) {
// 条件表达式2成立时执行的代码-- - 2
// } else if (...) {
// }
// 判断奇数偶数
// var num1 = prompt('请输入一个数字') - 0;//返回值是字符串类型的数据 - 0
// if (num1 % 2 == 0) {
// alert('偶数')
// } else {
// alert('奇数')
// }
// if (num1 % 2) {
// alert('ji数')
// } else {
// alert('偶数')
// }
// 判断一个数字是否在某一个范围
// 判断n是否在15~20之间
var n = 21;
// if (15 <= n <= 20) { // false <=20
// console.log(n + '在范围内')
// }
//
if (15 <= n && n <= 20) {
console.log(n + '在范围内')
} else {
console.log(n + 'bu在范围内')
}
</script>
- switch 分支语句
switch 翻译:开关 转换 case 翻译：选项
格式：
switch (条件表达式) {
case value1:
执行的语句1…;
break;
case value2:
执行的语句2…;
break;
case value3:
执行的语句3…;
break;
…
default:
当所有的case都没有匹配上时执行的代码
}
注意：- switch后的表达式的结果和case后的值进行的是全等匹配
- defalse可以写也可以不写
- case后面的值得是一个字面量，不能是一个范围(if else语句可以判断范围)
- if 语句会依次判断所有条件表达式是否成立，switch语句先进行条件判断直接进入到匹配上的哪一个case语句后，switch语句的效率会更高
实例：
<script>
var box1 = '3';
switch (box1 - 1) {
case 1:
console.log('我被匹配上了----1');
console.log('我被匹配上了----1');
case 2:
console.log('我被匹配上了----2');
case 3:
console.log('我被匹配上了----3');
case 4:
console.log('我被匹配上了----4');
default:
console.log('所有的case都没有匹配上');
}
console.log("-------后面");
// ----case后面只能是字面量 不能是范围
var box2 = 59;
switch (false) {
case box2 < 60: // case 后面的值是 true
console.log('不及格')
break;
case box2 >= 60: // case 后面的值是 false
console.log('及格');
default:
console.log('~~~~~~~~~~')
}
// -----利用break穿透 月份的天数 1 3 5 7 8 10 12 ---》31天 ； 4 6 9 11 ---》30天 2---》28天
// 用户输入一个月份，告诉用户该月的天数
// var n = prompt('请输入一个月份') - 0;
// switch (n) {
// case 1:
// case 3:
// case 5:
// case 7:
// case 8:
// case 10:
// case 12:
// alert('31天');
// break;
// case 4:
// case 6:
// case 9:
// case 11:
// alert('30天')
// break;
// case 2:
// alert('28天');
// }
//----使用switch 判断学生成绩是否及格
/*
10.0
9.9
8.1
5.9
*/
var score = prompt('请输入您的成绩') - 0;
switch (parseInt(score / 10)) {
case 10:
case 9:
alert('优秀');
break;
case 8:
alert('良好');
break;
case 7:
case 6:
alert('及格了')
break;
default:
alert('不及格')
}
// switch (parseInt(score / 10)) {
// case 6:
// case 7:
// case 8:
// case 9:
// case 10:
// alert('及格了')
// break;
// default:
// alert('不及格')
// }
switch (sroce >= 60) {
case true:
alert('及格')
default:
alert('及格')
}
</script>
- 循环结构
- 循环的分类:
- while
- do while
- for
- 循环结构成立的条件:
- 初始值： 一般都是声明一个变量作为循环的开始
- 条件表达式：循环的判断条件，根据判断条件决定是否继续循环
- 循环体：重复执行的代码段
- 改变初始值：更新变量（操作表达式）
-
while循环
while 翻译： 当……的时候
格式：
var 变量 = 1; //循环的初始值
while (条件表达式) {
循环体，重复执行的代码
更新变量（更新变量要写在循环体的最后面）
}
规则：条件表达式成立时则执行{}内的循环体，如果条件表达式不成立则不执行{}内的代码注意：更新变量必须要有，如果没有更新变量就会造成死循环（程序员的尊严！）
- 循环的分类:
实例：
<script>
// var n = 1; //循环的初始值 初始值只会执行一次
// while (n <= 5) {
// console.log('---------', n);// 1 2 3 4 5 // 1 1 1 1 1 1 1 1 1 1 1
// // n = n + 1; //更新变量
// // n += 1;
// ++n;
// }
// console.log('循环外面的', n);//6
// 打印100以内的数字
// var m = 0;
// while (m < 100) {
// console.log(m);
// ++m;
// }
// 100以内所有数字之和
// var m = 1;
// var sum = 0;//和
// while (m <= 100) {
// console.log(m);
// // sum = sum + m;
// sum += m;
// ++m;
// }
// console.log('-----和----------', sum);
// 求100内所有偶数 和 奇数的和分别是多少
var m = 1;
var evenSum = 0; //偶数和
var oddSum = 0;//奇数和
while (m <= 100) {
// console.log(m);
if (m % 2 === 0) {
// 当前数字是偶数
evenSum += m;//0+2+4+6+......+100
} else {
// 当前数字是奇数数
oddSum += m;//0+1+3+5+.....+99
}
++m;
}
console.log(`100以内的偶数和为：${evenSum} 奇数和为：${oddSum}`);
// ------------------------------ 6的阶乘 6*5*4*3*2*1
var n = 6; //初始值
var and = 1;//积
while (n >= 1) {
and = and * n;//1*6*5*4*3*2*1
--n;//更新变量 5 4 3 2 1 0
}
console.log(`6的阶乘的结果：${and}`);
//------------------------------------ 求一个班级学生平均成绩
// // 需要知道：班级人数 每一个学生的成绩
// var num = prompt('请输入班人数') - 0; //总人数 3
// var zcj = 0;//成绩的综合
// var int = 1;
// while (int <= num) {
// zcj += prompt(`请输入第${int}个学生的成绩`) - 0;//0+10+20+30
// int++;//更新变量
// }
// var average = zcj / num; //总成绩除以人数 得到平均成绩
// alert(`该班级学生的平均成绩为${average}`)
//--------------------------------- 猜数字大小
var value01 = prompt('请输入一个10以内的整数') - 0;
var real = 7;
// 当用户输入的值不是7的时候，让用户继续输入
while (value01 !== real) {
// 猜错了，给用户提示并让用户从新输入
if (value01 > real) {
// 猜大了,重新输入
value01 = prompt('猜大了,请重新输入') - 0;
} else if (value01 < real) {
// 猜小了,重新输入
value01 = prompt('小了,请重新输入') - 0;
}
}
alert('才对了')
</script>
- do while 循环
-
do while是while的变体
-
格式：
do {
循环体
更新变量
} while (条件表达式) -
规则：
do while不论条件表达式是否成立都先执行一次，执行后再判断条件表达式是否成立，成立则继续循环，不成立则结束循环do while不论条件表达式是否成立至少执行一次
-
实例：
<script>
// var i = 1;
// while (i <= 10) {
// console.log('i----', i);
// ++i;
// }
// ------do while
var f = 10;
do {
console.log('我被执行了', f); //10
++f;
} while (f < 10)
//---- 求1~100的和
var m = 1;
var sum1 = 0;
do {
console.log('----------', m)
sum1 += m;
++m;
} while (m <= 100)
console.log('和为', sum1);
</script>
- for 循环
for循环应用最多，是while语法糖，写起来方便，但是看起来不方便
格式：
for (变量初始化; 条件表达式; 更新变量) {
循环体
}
实例：
<script>
// --- 1~100的和
// var sum = 0;
// for (var i = 1; i <= 100; ++i) {
// console.log('----', i);
// sum += i;
// }
// console.log('和----', sum);
// 等同于while循环
// var i = 1;
// for (; i <= 100;) {
// console.log('----', i);
// ++i;
// }
// 变量初始值只执行一次
// 判断条件表达式是否成立，成立则执行循环体{}内的代码
// 循环体执行后更新变量，再判断条件表达式是否成立，成立则继续循环，直到条件表达式不成立则退出循环
for (var i = 1; i <= 5; ++i) {
console.log('----', i);//1 2 3 4 5
}
</script>
for循环案例：
<script>
// ---- 打印100以3的倍数 先得到100以内所有数字，找出3的倍数即可
// for (var i = 1; i <= 100; i++) {
// if (!(i % 3)) { //0---》false 非0 ---》true
// console.log(i);
// }
// }
// ---
/*
找出百位数的所有的 水仙花数字 （100~999）
水仙花数字: 三次自幂数
即：一个三位数的每一位数字的三次方之和等于这数字本身
153 == 1**3 + 5**3 + 3**3
153 == 1*1*1 + 5*5*5 + 3*3*3
*/
// for (var j = 100; j <= 999; j++) {
// // console.log(j); //101
// var a = parseInt(j / 100);//-->1.01 --> 1
// var b = parseInt(j % 100 / 10);//1--->0.1 --->0
// var c = j % 10;//--->1
// if (a ** 3 + b ** 3 + c ** 3 === j) {
// console.log(`${j}是水仙花数字`)
// }
// }
// ----
/*
js单线程的语言
按照代码的书写顺序从上向下依次执行，会等上面的语句执行完再去执行下一句
*/
console.log(1111);
// alert('**')
for (var m = 1; m <= 300000; m++) {
console.log('----', m);//---1 2 3
}
console.log(22222);
</script>
双层for循环：
<script>
/*
双层for循环
规则：外层循环执行一次，内循环全部执行完
*/
for (var i = 1; i <= 5; i++) {
console.log(`我是第${i}个馒头`);
for (var j = 1; j <= 3; j++) {
console.log(`--------我是第${i}个馒头的第${j}口`);//-- 1 2 3
}
if (i < 5) {
console.log('老板再来一个');
}
}
// ----- 在页面中打印正方形
/*
* * * *
* * * *
* * * *
* * * *
*/
// 用外层的for循环 控制 正方形的行数
for (var m = 1; m <= 4; m++) {
// 用内层循环控住每一行的正方向有多少*
var str = '';
for (var n = 1; n <= 4; n++) {
// console.log('*')
str += ' * '
}
document.write(str + "<br>")
}
document.write('<br>')
for (var m = 1; m <= 4; m++) {
// 用内层循环控住每一行的正方向有多少*
for (var n = 1; n <= 4; n++) {
document.write(' * ');// * * * *
}
document.write("<br>")
}
// ----- 打印三角形
/*
* * *
* * * *
*/
document.write("<br>")
// 外层循环控制行数
for (var x = 1; x <= 9; x++) {
// 内层循环控制每一行有多少个*
for (var y = 1; y <= x; y++) {
document.write(' * '); //*
}
document.write("<br>")
}
// ---- 打印梯形
document.write("<br>")
// 外层循环控制行数
for (var x = 1; x <= 9; x++) {
// 前几行不输出
if (x >= 4) {
// 内层循环控制每一行有多少个*
for (var y = 1; y <= x; y++) {
document.write(' * '); //*
}
}
document.write("<br>")
}
</script>
循环控制语句：
<script>
// for (var j = 1; j <= 3; j++) {
// if (j == 2) {
// continue;
// // 结束当前这一次循环，直接到更新变量，继续下一次
// }
// console.log(`第${j}口`);//-- 1 2 3
// }
// for (var j = 1; j <= 3; j++) {
// if (j == 2) {
// break;
// // break循环控制语句的作用：退出整个循环，没有下一次循环了
// }
// console.log(`第${j}口`);//-- 1 2 3
// }
for (var i = 1; i <= 5; i++) {
console.log(`我是第${i}个馒头`);
for (var j = 1; j <= 3; j++) {
// 第三个馒头的第2口有苍蝇不吃了
if (i == 3 && j == 2) {
// continue;
// 结束当前这一次循环，继续下一次
break;
}
console.log(`--------我是第${i}个馒头的第${j}口`);//-- 1 2 3
}
if (i < 5) {
console.log('老板再来一个');
}
}
// ---- 打印梯形
document.write("<br>")
// 外层循环控制行数
for (var x = 1; x <= 9; x++) {
// 前几行不输出
if (x <= 3) {
continue;
}
// 内层循环控制每一行有多少个*
for (var y = 1; y <= x; y++) {
document.write(' * '); //*
}
document.write("<br>")
}
</script>
复杂数据类型
数组
- 数组是js中的一种数据类型，是一种表示集合的数据类型，像一个盒子一样，用来存储一堆数据
- 创建数组的方式
- 使用字面量创建数组 [] [1,2,4,5,67,8] 推荐；使用字面量创建数组的时候可以直接添加一些数组元素，每一个数组的元素之间使用逗号分割
- 使用js给我们提供的内置构造函数创建数组 Array
格式： new Array() - 数组里面成员可以是任何类型的数据
- 数组的索引，数组中的数据是以索引（下标）的形式来存储
索引就是用来访问数组成员的序号
数组的索引是从0开始的 0 1 2 3 4 5 。。。。 - 访问数组成员
格式： 数组名[index] - 数组的长度 （数组中成员的个数）
数组的length属性是一个可读（读取，获取，访问）写（写入，设置，赋值）的属性
读取： 数组.length 返回值：数组的长度
写：数组.length=数值;- 当设置的数组长度大于数组的原长度的时候可以起到给数组扩容的目的，多出来的以空位补齐
- 当设置的数组长度小于数组的原长度的时候可以将数组中多出来的成员删除
实例：
<script>
// var a = "小红", b = '小明', c = '小王', d = '奔波霸er', e = "霸波奔";
var nameBox = ["小红", '小明', '小王', '奔波霸er', "霸波奔", 123, 88, null, undefined, [23, 55]]
// Array 使用js给我们提供的内置构造函数创建数组
var array1 = new Array();//创建出来一个空数组
var array2 = new Array(4); //参数为1个数值的时候，这个数值表示数组的长度（数组中的成员的个数），这个数组中有两个数据，数据为空
var array3 = new Array(2, 3, '777');//参数为多个数值的时候，多个参数表示为数组里成员
console.log(array1, '----', array2, '----', array3);
// 数值索引
console.log(nameBox);
// 访问数组
console.log(nameBox[1], nameBox[3]);
// 数组长度 读取
console.log(nameBox.length); //读取 10
nameBox.length = 40;
console.log(nameBox)
console.log(nameBox.length)
// 获取数组中的数据
console.log(nameBox[0]);//获取数组中的第一个成员
// 数组中最后一个成员的索引: 数组.length-1
console.log(nameBox[nameBox.length - 1]);//获取数组中的最后一个成员 最后一个成员是空位，获取空位上的数组时返回结果是undefined
//当设置的数组长度小于数组的原长度的时候可以将数组中多出来的成员删除
var box2 = [1, 23, 45, 66, 66, 7]
// box2.length = 4;
// 清空数组 将数组长度设置为0
box2.length = 0;
console.log(box2, '---------', box2.length);
</script>
数组案例：
<script>
var box1 = [1, 4, 5, 6, 73, 55, 33, 88, 229, 888, 7, 6, 9]; //0 1 2 3 4 5 6 7 ...
// 遍历数组 （依次访问数组中每一个成员）
// 访问数组中的成员 数组[索引]
// 使用变量i作用数组的索引
// for (var i = 0; i < box1.length; i++) {
// console.log(i);
// }v
// for (var i = 0; i <= box1.length - 1; i++) {
// console.log(i, '----', box1[i]);//1 4
// }
// -- 求数组box1中成员之和
var sum = 0;
for (var i = 0; i <= box1.length - 1; i++) {
console.log(i, '----', box1[i]);//1 4
sum += box1[i]
}
console.log(`和为：${sum}`)
</script>
</body>
冒泡排序：
口诀：双层for循环，一层减一次，里层减外层，变量相交换
<script>
var arr1 = [234, 465, 35, 244, 22, 8888];
// 外面控制执行多少趟
for (var i = 0; i < arr1.length - 1; i++) {
// 里面循环控制每一趟比较交换多少次
// 0 1 2 3 4
// 第一个-1，是不让最后一个数值和undefiend
// 第一趟 倒数第一大后再倒数第一位 i-->0 （arr1.length - 1）-i= 4次
// 第2趟 倒数第2大后再倒数第2位 i-->1 （arr1.length - 1）-i= 3次
// 第3趟 倒数第3大后再倒数第3位 i-->2 （arr1.length - 1）-i= 2次
// 第4趟 倒数第4大后再倒数第4位 i-->3 （arr1.length - 1）-i= 1次
// 第5趟 没有必要
for (var j = 0; j < arr1.length - 1 - i; j++) {
// 变量相交换
if (arr1[j] > arr1[j + 1]) {
var center = arr1[j];
arr1[j] = arr1[j + 1];
arr1[j + 1] = center;
}
}
}
</script>
函数
-
函数可以用来封装一段可以被重复执行的代码，可以一段代码被重复利用，大大简化我们的代码结构
-
使用函数的步骤：定义函数；调用函数
- 定义函数
声明式函数 （命名式函数，函数是有名字）
使用function关键字来声明函数
格式：
function 函数名(){
函数体
} - 函数名命名要符合变量命名的规则
- 不能使用关键字，保留字作为函数名
- 只能使用数字，字母，下换线，$,不能以数字开头
- 函数在命名的时候尽量使用一些动词作为函数名
- 赋值式函数
格式：
var sayBaby = function () {
console.log(‘再见’)
};
- 定义函数
-
注意： 函数名 和 函数名()的区别
两种定义函数方式的区别，两种方式定义的函数的调用时机不同
- 声明式函数（命名函数）可以在声明之前调用
- 赋值式函数不能在声明之前调用，如果先调用会报错推荐：先定义（声明）函数后调用
实例：
<script>
fn1();
function fn1() {
console.log('我被执行了-----1');
}
// fn2();
var fn2 = function () {
console.log('我被执行了-----2');
}
// 封装一个可以使用数组冒泡排序的函数
// function getOrderArr() {
// for (var i = 0; i < arr2.length - 1; i++) {
// // 里面循环控制每一趟比较交换多少次
// for (var j = 0; j < arr2.length - 1 - i; j++) {
// // 变量相交换
// if (arr2[j] > arr2[j + 1]) {
// var center = arr2[j];
// arr2[j] = arr2[j + 1];
// arr2[j + 1] = center;
// }
// }
// }
// }
*/
fn1();
function fn1() {
console.log('我被执行了-----1');
}
// fn2();
var fn2 = function () {
console.log('我被执行了-----2');
}
// 封装一个可以使用数组冒泡排序的函数
// function getOrderArr() {
// for (var i = 0; i < arr2.length - 1; i++) {
// // 里面循环控制每一趟比较交换多少次
// for (var j = 0; j < arr2.length - 1 - i; j++) {
// // 变量相交换
// if (arr2[j] > arr2[j + 1]) {
// var center = arr2[j];
// arr2[j] = arr2[j + 1];
// arr2[j + 1] = center;
// }
// }
// }
// }
</script>
-
函数的参数
当函数里面有一些值是不固定的时候，我们可以在定义函数的时候使用参数来表示这些不确定的值
格式：
function 函数名(参数1，参数2,参数3…){}
-
函数的参数分为两种
- 形参 在函数定义的时候写在函数名后的就是形参，作用：形参就是形式上参数，就是一个可以在函数内部使用的一个不需要单独声明变量
- 形参是用来接收实参的
- 形参是用来占位的，实际参与运算的是实参
- 形参在命名的时候需要符合变量命名的规则
- 实参 在函数调用的时候。传入函数的就是实参
- 实参可以是任何类型的数据
- 实参是在函数中实际参与运算
- 形参 在函数定义的时候写在函数名后的就是形参，作用：形参就是形式上参数，就是一个可以在函数内部使用的一个不需要单独声明变量
-
实参和形参的关系
- 实现和形参原则上是个数一样，要从左向右依次对应的
- 实参的个数小于形参的个数
- 形参在没有赋值的时候，形参的默认值是undefined
- 实参个数小于形参时，可以直接省略后面的，不能省略前面，可以显示的传入undefiend
- 实参的个数大于形参的个数
前面的一一对应，后面多出来的实参没有形参接收，我们不能直接使用
实例：
<script>
*/
function sayHello2(name, a, b) {
console.log('你好----', name, a, b);
}
sayHello2('李四', 1, 2);
sayHello2('王五', 3, 6)
sayHello2('小红', 5, 8)
sayHello2(1122, 9, 10)
sayHello2([1, 2, 3], 22, 11)
sayHello2()
sayHello2('王一博')
sayHello2(undefined, undefined, 8)
// 实参多余形参
sayHello2('蔡徐坤', 6666, 888, 999, 777)
</script>
- 函数的返回值：
- 函数在调用后 默认的返回值是undefined
- 在函数内可以使用return 关键字来指定函数的返回值，当我们没有使用return来指定返回值的时候，函数采用默认的返回值undefined，如果指定了则采用return后指定的返回值
实例：
<script>
*/
// ---- 冒泡排序的函数
// 封装一个可以使用数组冒泡排序的函数
function getOrderArr(arr2) {
for (var i = 0; i < arr2.length - 1; i++) {
// 里面循环控制每一趟比较交换多少次
for (var j = 0; j < arr2.length - 1 - i; j++) {
// 变量相交换
if (arr2[j] > arr2[j + 1]) {
var center = arr2[j];
arr2[j] = arr2[j + 1];
arr2[j + 1] = center;
}
}
}
// 得到排序后数组，对数组的操作可能有多种形式，可以将排序后的数组作为函数的返回值返回出去，在函数外对返回值进行不同的操作
return arr2;
}
console.log(getOrderArr([1, 3, 5, 9, 2, 6, 4, 8]));
// alert(getOrderArr([2, 1, 3]))
// getOrderArr([22, 66, 44, 66, 88, 99, 333])
function fn1() {
var abc = 3333;
console.log(111);
// return 后只能指定一个函数的返回值,如果想要返回多个值则可以将多个值放到一个表示集合的数据
// return [456, 789];
// 在函数内return一个变量的时候，实际是return的是变量存储的值
return abc;
// return 关键字的作用：1 指定的函数返回值 2: 打断函数 （return后的代码不会再执行）
// return 指定函数的返回值可以是任何类型的数据
console.log('函数执行完了，也返回了')
}
var res = fn1()
console.log(res);
/*
js中的数据类型
- 基本数据类型
- 复杂数据类型
- 对象 - 对象 {}
- 数组 []
- 函数 function
*/
/*
打断函数用 return
打断循环 break continue
*/
</script>
682
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
