流程控制，模板函数

流程控制的分支，循环

1.分支
1.1单分支 if
js
‘’’
let age = 28;
if (age >= 18) {
console.log(“允许观看”);
}
‘’’
1.2双分支if-else 简化 condition？true：false
js
‘’’
age = 18;
if (age >= 18) {
console.log(“允许观看”);
} else {
console.log(“少儿不宜”);
}
age = 35;
let res = age >= 18 ? “允许观看” : “少儿不宜”;
console.log(res);
‘’’
1.3多分支if-elseif-else/switch
js
‘’’
age = 60;
if (age >= 18 && age < 35) {
console.log(“允许单独观看”);
} else if (age >= 35 && age < 60) {
console.log(“允许二人观看”);
} else if (age >= 60 && age < 120) {
console.log(“建议在家人陪同下观看”);
} else if (age <= 3 || age >= 120) {
console.log(“非法年龄”);
} else {
console.log(“少儿不宜”);
}
//!switch
//区间判断，使用true
age = 10;
switch (true) {
case age >= 18 && age < 35:
console.log(“允许单独观看”);
break;
case age >= 35 && age < 60:
console.log(“允许二人观看”);
break;
case age >= 60 && age < 120:
console.log(“建议在家人陪同下观看”);
break;
case age <= 3 || age >= 120:
console.log(“非法年龄”);
break;
default:
console.log(“少儿不宜”);
}
//单值判断：变量
let lang = “html”;
lang = “css”;
lang = “javascript”;
lang = “js”;
lang = “HTML”;
switch (lang.toLowerCase()) {
case “html”:
console.log(“超文本编辑语言”);
break;
case “css”:
console.log(“层叠样式表”);
break;
case “javascript”:
case “js”:
console.log(“通用前端脚本编程语言”);
break;
default:
console.log(“不能识别”);
}
‘’’

循环

1.while/do while
js
‘’’
//!while循环
i = 0;
while (i < length) {
console.log(colors[i]);
i++;
}
//!循环三条件
//1.初始条件：数组索引的引用（i=0)
//2.循环条件：为真才执行的循环体（i<arr.length)
//3.更新条件：必须要有，否则进入死循环（i++)
//do{}while(),出口型判断，无论条件是否成立，必须执行一次代码块
i = 0;
do {
console.log(colors[i]);
i++;
} while (i < length);
‘’’
2.for
js
‘’’
//for(初始条件;循环条件;更新条件){}
for (i = 0, leng = colors.length; i < length; i++) {
console.log(colors[i]);
}
//for-of;快速迭代处理集合数据
//用户不必再关心索引，而将注意力集中在数组成员上
for (let item of colors.entries()) {
console.log(item);
}
for (let item of colors.keys()) {
console.log(item);
}
for (let item of colors.values()) {
console.log(item);
}
for (let item of colors) {
console.log(item);
}
//!for-in 对象遍历
const obj = { a: 1, b: 2, c: 3, say: function () {} };
for (let key in obj) {
console.log(obj[key]);
}
‘’’

参数与返回值

1.参数
1.1参数不足：默认参数
f = (a, b = 0) => a + b;
console.log(f(1));
1.2参数过多：…rest
f = (…arr) => arr;
console.log(f(1, 2, 3, 4, 5));
console.log(…[1, 2, 3, 4, 5]);
2.返回值
2.1默认单值
2.2多值
2.2.1数组
f = () => [1, 2, 3];
console.log(f());
2.2.2对象
f = () => ({ a: 0, b: 1, c: 2, get: function () {} });
console.log(f());

字面量简化方案

1.属性简化
//变量name与属性name同名
//且在同一个作用域中，可以不写变量名
let name = “朱老师”;
//!属性简化
let user = {
// name:”朱老师”,
// name:name,
name,
};
console.log(user.name);
2.方法简化
/user = {
name,
//所谓方法：本质仍是属性，只不过它的值是一个函数声明，将”:function”删除
getName: function(){
return this.name;
},
};/
user = {
name,
getName() {
return this.name;
},
};
// console.log(user.getName());
console.log(user.getName());

模板字面量

js
‘’’
//传统
console.log(“hello world”);
//模板字面量：反引号定义
console.log(hello world);
//模板字面量中，可以使用“插值”（变量，表达式），可以解析变量
let name = “朱老师”;
console.log(“hello” + name);
//变量/表达式等插值，使用${…}插入到模板字面量中
console.log(hello ${name});
console.log(10+20= ${10 + 20});
‘’’

模板函数

1.使用“模板字面量”为参数
2.第一个参数必须是模板字面量中的“字面量”组成的数组
3.第二个参数起是“模板字面量”的插值列表，通常使用“…rest”来归并到一个数组中处理

流程控制的分支，循环

循环

参数与返回值

字面量简化方案

模板字面量

模板函数

更多相关文章

随机推荐