1.循环
设置一个实验用的数组：
const todos = [
{
id: 1,
text: 'Take out trash',
isCompleted: true
},
{
id: 2,
text: 'Meeting with boss',
isCompleted: false
}
]
for循环
for(let i = 0; i <= 5; i++){
console.log(`For loop number: ${i}`);
}
遍历数组
for(let todo of todos){
console.log(todo.text)
}
while循环
let i = 0;
while(i < 3){
console.log(`while-loop number: ${i}`);
i++;
}
高阶数组high-order-array
(1) forEach
(2) map 从数组中创建新数组
(3) filter 根据条件创建新数组
(1) forEach迭代器 方法的参数是函数
//回调函数callback function可以写多个参数
//第一个参数是迭代对象
todos.forEach(function(todo){
console.log(todo.text);
});
(2)map迭代器 会返回一个数组
const todoText = todos.map(function(todo){
return todo.text;
});
console.log(todoText)
调试器输出：
['Take out trash', 'Meeting with boss']
0: "Take out trash"
1: "Meeting with boss"
length: 2
[[Prototype]]: Array(0)
(3) filter选择器，选出符合条件的
const todoCompleted = todos.filter(function(todo){
return todo.isCompleted == true;
});
console.log(todoCompleted);
调试器输出：
0: {id: 1, text: 'Take out trash', isCompleted: true}
length: 1
[[Prototype]]: Array(0)
//组合使用：输出isCompleted为true的text
const todo1 = todos.filter(function(todo){
return todo.isCompleted == true;
}).map(function(todo){
return todo.text;
})
console.log(todo1)
//output: ['Take out trash']
2.条件
if-else
const x = 10;
if(x == 10){
console.log('x is 10');
// ===必须考虑类型，==会做类型转换
//所以如果改成const x = '10'
//则 == true === false
//尽量习惯用===因为经常需要匹配类型
}else if(x > 10){
console.log('x is bigger than 10')
}else{
console.log('x is smaller than 10');
}
//if条件内 或|| 与&&
三元操作符 ternary operator
const y = 10;
const color = y > 10 ? 'red' : 'blue';
console.log(color);
switch
switch(color){
case 'red':
console.log('R');
break;
case 'blue':
console.log('B');
break;
default:
console.log('not R or B');
break;
}
3.函数function
function addNums(n1 = 1, n2 = 2){
console.log(n1 + n2);
}
addNums(5, 4);//9
addNums(6,);//8
addNums();//3
箭头函数arrow functions(ES6引入)
const addNumnew = (num1, num2) => num1 + num2;
console.log(addNumnew(5,6));
可运行的完整代码：
//1.循环
const todos = [
{
id: 1,
text: 'Take out trash',
isCompleted: true
},
{
id: 2,
text: 'Meeting with boss',
isCompleted: false
}
]//用到的数组
//for-loop
for(let i = 0; i <= 5; i++){
console.log(`For loop number: ${i}`);
}
//遍历数组
for(let todo of todos){
console.log(todo.text)
}
//while-loop
let i = 0;
while(i < 3){
console.log(`while-loop number: ${i}`);
i++;
}
//高阶数组high-order-array
//forEach
//map 从数组中创建新数组
//filter 根据条件创建新数组
//forEach迭代器 方法的参数是函数
//回调函数callback function可以写多个参数
//第一个参数是迭代对象
todos.forEach(function(todo){
console.log(todo.text);
});
//map迭代器 会返回一个数组
const todoText = todos.map(function(todo){
return todo.text;
});
console.log(todoText)
/*
调试器输出：
(2) ['Take out trash', 'Meeting with boss']
0: "Take out trash"
1: "Meeting with boss"
length: 2
[[Prototype]]: Array(0)
*/
//filter选择器，选出符合条件的
const todoCompleted = todos.filter(function(todo){
return todo.isCompleted == true;
});
console.log(todoCompleted);
/**调试器输出：
0: {id: 1, text: 'Take out trash', isCompleted: true}
length: 1
[[Prototype]]: Array(0)
*/
//组合使用：输出isCompleted为true的text
const todo1 = todos.filter(function(todo){
return todo.isCompleted == true;
}).map(function(todo){
return todo.text;
})
console.log(todo1)
//output: ['Take out trash']
//2.条件
const x = 10;
if(x == 10){
console.log('x is 10');
// ===必须考虑类型，==会做类型转换
//所以如果改成const x = '10'
//则 == true === false
//尽量习惯用===因为经常需要匹配类型
}else if(x > 10){
console.log('x is bigger than 10')
}else{
console.log('x is smaller than 10');
}
//if条件内 或|| 与&&
//三元操作符 ternary operator
const y = 10;
const color = y > 10 ? 'red' : 'blue';
console.log(color);
switch(color){
case 'red':
console.log('R');
break;
case 'blue':
console.log('B');
break;
default:
console.log('not R or B');
break;
}
//3.函数function
function addNums(n1 = 1, n2 = 2){
console.log(n1 + n2);
}
addNums(5, 4);//9
addNums(6,);//8
addNums();//3
//箭头函数arrow functions(ES6引入)
const addNumnew = (num1, num2) => num1 + num2;
console.log(addNumnew(5,6));
