1. 流程控制
1.1 顺序流程控制
按照程序员的书写先后顺序执行
1.2 if else语句
- 代表否定的值会被转换为 false
- 其余的值都会被转换成 true
if 条件为 true，执行代码
if 条件为 false，结束 if 语句
let age = prompt('请输入您的年龄：')
if (age <=18){
alert('再见，您未满18岁');
} else if (age < 60){
alert('可正常进入网吧');
} else {
alert('再见，老年人禁止进入网吧');
}1.3 switch语句
- 执行思路：利用表达式的值 和 case 后面的选项值相匹配
- 如果 “匹配” 上了，就执行 case 里面的语句
- 如果 “没匹配” 上，那么执行 default 里面的语句
let fruit = prompt('请输入需要查询的水果：')
switch(fruit) {
case '苹果':
alert('苹果的价格时3.5/斤');
break;
case '香蕉':
alert('苹果的价格时4.5/斤');
break;
case '梨子':
alert('苹果的价格时1.0/斤');
break;
default:
alert('没有此水果');
}注意：
- 我们开发中，表达式常常写成变量
- 我们 num 的值 和 case 里面的值相匹配时（是全等），必须是 值和数据完全一致才可以
- break 如果当前 case 没有 break ，则不会退出 switch, 而是继续执行下一个 case
1.4 三元表达式
- 条件表达式 ? 表达式1 ： 表达式2
- 若 条件表达式结果为真，则返回表达式1
- 若 条件表达式结果为假，则返回表达式2
let time = prompt('请输入一个 0~59之间的数字：');
let result = time < 10 ? '0'+time : time;
alert(result);1.5 for 循环
明确循环次数： 推荐按使用 for 循环
不明确循环次数： 推荐使用 while 循环
循环的中最大价值就是遍历数组
语法：
for ( 起始值; 终止条件; 变化量 ) {
// 循环体
}
for (let i = 0; i <= 100; i++){
if(i == 1){
console.log('这个人今年出生了');
} else if(i == 100){
console.log('这个人今年出生了');
} else {
console.log('这个人今年'+i+'岁了');
}
}for (let i in obj) {
// k: 属性名
// obj[k]: 属性值
}1.6 while 循环
明确循环次数： 推荐按使用 for 循环
不明确循环次数： 推荐使用 while 循环
循环的中最大价值就是遍历数组
语法：
while (条件表达式){
//循环体
}
- 执行思路：当条件表达式结果为 true，则执行循环体，否则，退出循环
- 里面应该也完成计时器更新，防止死循环
let message = prompt('你爱我吗？');
while (message !== '我爱你'){
message = prompt('你爱我吗？')
}// ATM 存取钱案例
<script>
let money = 100
// 输入操作
while (true) {
let a = prompt(
`请选择您的操作：
1. 查看余额
2. 存款
3. 取款
4. 退出 `
)
// 增删改查
switch (a) {
case '1':
alert('余额为' + money + '元')
break
case '2':
let im = +prompt('请输入存款金额：')
money += im
alert('存款成功')
break
case '3':
let ex = +prompt('请输入取款金额')
if (ex > money) {
alert('取款金额大于余额')
} else {
money -= ex
alert('取款成功')
}
break
}
// 退出
if (a === '4') {
break
}
}
</script>1.7 do while 循环
语法：
do {
//循环体
} while (条件表达式)
- 执行思路：先执行一次循环体，再判断循环条件
- do while 至少执行一次循环体
1.8 continue 关键字
continue 关键字：
- 用于立即 跳出本次循环，继续执行下一次循环
- 本次循环中 continue 之后的代码，会少执行一次
//求1~100之间，除了能被7整除之外的整数和
let num = 0;
for(let i = 1;i <= 100; i++){
if(i % 7 == 0){ 只要遇见continue 就退出本次循环 直接跳到i++
continue;
}
num = num + i;
}
console.log(num);1.9 break 关键字
break 关键字：
- 用于 立即跳出整个循环（循环结束）
for(let i = 0; i <= 5; i++){
if(i == 3){
break;
}
console.log('我正在吃第'+i+'个包子');
//即打印到第3包子结束
}2. 数组
2.1 数组的创建
- 数组中可以存放任意类型的数据 （字符串、数字、布尔值等）
let arr = new Array ( )
let arr = []
let arr = ['小白'，12，true]2.2 数组的遍历
- 方式一
// 定义
let arr = ['red','green','blue'];
// 遍历
for (let i = 0; i < arr.length; i++) {
console.log(arr[i])
}- 方式二
// 定义
let arr = ['red','green','blue'];
// 遍历
for (let i in arr) {
console.log(arr[i])
}2.3 添加、删除数组元素
添加：
- push() 动态的向数组的尾部添加一个元素
- unshift() 动态的像数组首部添加一个元素
删除：
- pop() 删除数组的最后一个元素
- shift() 删除数组第一个元素
- splice(从第几个开始，删除几个) 动态的删除数组的元素
//把<2000添加到新数组
let arr = [1500, 1200, 2000, 2100, 1800];
let newArr = [];
for ( let k in arr) {
if (arr[k] < 2000) {
newArr.push(arr[k]);
}
}
console.log(newArr);2.4 筛选数组
筛选出数组中元素大于10的元素
- 方法一
let arr = [2,6,8,22,89,90,0,7];
let newarr = [];
let j = 0;
for (let i = 0; i < arr.length; i++) {
if (arr[i] > 10) {
newarr[j] = arr[i];
j++; // 否则就会一直覆盖第一个元素
}
}
console.log(newarr);- 方法二
let arr = [2,6,8,22,89,90,0,7];
let newarr = []; // newarr.length=0
for (let i = 0; i < arr.length; i++) {
if (arr[i] > 10) {
newarr[newarr.length] = arr[i];
}
}
console.log(newarr);2.5 翻转数组
- arr. reverse ( ) 直接翻转数组
- instanceof 运算符： 检测是否为数组 console.log(arr instanceof Array)
- isArray(参数) : 检测是否为数组 console.log(Array.isArray(arr))
let arr = ['red','blue','yellow','green'];
let newarr = [];
if(arr instanceof Array){ // instanceof关键字:判断arr是否为数组
for (let i = arr.length - 1; i >= 0; i--) {
newarr[newarr.length] = arr[i];
}
return newArr;
}else{
return 'arr必须是数组'
}
console.log(newarr); 2.6 冒泡排序
- 冒泡排序：一次比较两个元素，如果顺序错误，则把他们交换过来
- arr.sort() 直接冒泡排序 但元素涉及多个双位数时，会出现错误，解决办法如下：
// 解决方法
let arr = [1,13,2,77,17];
arr.sort(function(a,b) {
return a-b; // 升序排列
// return b-a; // 降序排列
});
console.log(arr);// 冒泡排序原理
let arr = [5,4,3,2,1];
for (let i = 0; i < arr.length -1; i++) {
for (let j = 0; j <= arr.length - 1- i; j++) {
if (arr[j] > arr[j+1]) {
let temp = arr[j];
arr[j] = arr[j+1];
arr[j+1] = temp;
}
}
}2.7 数组索引的方法
| 方法名 | 说明 | 返回值 |
|---|---|---|
| indexOf( ) | 数组中查找给定元素的第一个索引 | 如果存在，返回索引号；如果不存在，返回-1 |
| lastIndexOf( ) | 在数组中给定元素的最后一个索引 | 如果存在，返回索引号；如果不存在，返回-1 |
let arr = ['yellow', 'red', 'green', 'blue','green'];
console.log(arr.indexOf('red')); // 2
console.log(arr.indexOf('pink')); // -1
console.log(arr.lastindexOf('green')); // 42.8 数组转换成字符串
| 方法名 | 说明 | 返回值 |
|---|---|---|
| toString( ) | 把数组转换成字符串，逗号分隔每一项 | 返回字符串 |
| join('分隔符') | 把数组中的每一个元素转换成字符串 | 返回字符串 |
| concat( ) | 连接两个或多个数组，不影响原数组 | 返回新数组 |
| slice(a, b ) | 数组截取 slice(begin, end) | 返回被截取项目的新数组 |
| splice( ) | 数组删除 splice(index，要删除的个数) | 返回被删除项目的新数组，注意：这个会影响原数组 |
//工作中常用
let arr = ['白色','黑色','粉色']
console.log(arr.join('-'))
console.log(arr.join('&'))2.9 打印三角*
// 外层打印几行
for (let i = 1; i <= 5; i++) {
// 里层打印几个星星
for (let j = 1; j <= i; j++) {
document.write('★')
}
document.write('<br>')2.10 九九乘法表
css 样式
span {
display: inline-block;
width: 100px;
padding: 5px 10px;
border: 1px solid pink;
margin: 2px;
border-radius: 5px;
box-shadow: 2px 2px 2px rgba(255, 192, 203, .4);
background-color: rgba(255, 192, 203, .1);
text-align: center;
color: hotpink;
}javascript
// 外层打印几行
for (let i = 1; i <= 9; i++) {
// 里层打印几列
for (let j = 1; j <= i; j++) {
// 只需要吧 ★ 换成 1 x 1 = 1
document.write(`
<div> ${j} * ${i} = ${j * i} </div>
`)
}
document.write('<br>')
}
419
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
