132. loop
If you want to change from
var todos = [
"clean room",
"brushteeth",
"exercise",
"study javascript",
"eat healthy"
]
to
var todos = [
"clean room!",
"brushteeth!",
"exercise!",
"study javascript!",
"eat healthy!"
]
Let's use 'loop'!
i stands for an index
todos.length = 5 in here
for(var i=0; i < todos.length; i++){
console.log(i);
}
When 'i' would be 5, the loop stops.
for(var i=0; 5 < todos.length; i++){
console.log(todos[i]);
}
^it's never going to go through this.
var todos = [
"clean room",
"brushteeth",
"exercise",
"study javascript",
"eat healthy"
];
for(var i=0; i < todos.length; i++){
console.log(todos[i]);
}
Using loop you can add exclamation mark "!".
for(var i=0; i < todos.length; i++){
console.log(todos[i]+ "!");
}
But if I do 'todos', it doesn't have exclamation marks we've just console logged.
We haven't actually changed that 'todo', right?
for
If we do like below,
for(var i=0; i < todos.length; i++){
todos[i] = todos[i]+ "!";
}
Because we've done them if you want to cross them off the list
for(var i=0; i < todos.length; i++){
todos[i].pop();
}
This doesn't work because that's the 'array' not 'string'.
What about this below?
for(var i=0; i < todos.length; i++){
todos.pop();
}
^Why is that?
Because we popped it,
'todos.length' changed to '4'
and i changed to '1'
and then,
'todos.length' changed to '3'
and i changed to '2'.
So, as you can see we removed "eat healthy", study javascript" and "exercise".
How can we fix that issue?
var todoslength = todos.length;
for(var i=0; i < todoslength; i++){
todos.pop();
}
Look at that! We finished all of our 'todos'!
while
var counterOne = 0;
while(counterOne < 10){
console.log(counterOne);
counterOne++
}
and the other way around? Count down.
var counterOne = 10;
while(counterOne > 0){
console.log(counterOne);
counterOne--
}
do-while
var counterTwo = 10;
do{
console.log(counterTwo);
counterTwo--;
} while (counterTwo>0);
difference between while and do-while
- while loop
first check condition and then do the stuffs. - do-while loop
firtst do the stuffs and then check condition.
Let me just demonstrate that point.
if we do change 0 to 10 in while loop
var counterOne = 10;
while(counterOne > 10){
console.log(counterOne);
counterOne--
}
var counterTwo = 10;
do{
console.log(counterTwo);
counterTwo--;
} while (counterTwo>10);
just logged '10' at script.js 22
You can see 'console.log' at line22
or you can check like this
var counterOne = 10;
while(counterOne > 10){
console.log("while", counterOne);
counterOne--
}
var counterTwo = 10;
do{
console.log("do while", counterTwo);
counterTwo--;
} while (counterTwo>10);
difference between a 'for' and 'forEach'
var todoslength = todos.length;
for(var i=0; i < todoslength; i++){
console.log(i);
}
todos.forEach(function(i){
console.log(i);
})// this function receives the argument of 'i', which is that each individual item in the 'todos'.
Using for Each we're not necessarily accessing the index.
var todoslength = todos.length;
for(var i=0; i < todoslength; i++){
console.log(todos[i]);
}
todos.forEach(function(i) {
console.log(i);
})
how do I access the index within the 'forEach'?
Using i
var todoslength = todos.length;
for(var i=0; i < todoslength; i++){
console.log(todos[i]);
}
todos.forEach(function(todo, i) {
console.log(todo, i);
})
var todoslength = todos.length;
for(var i=0; i < todoslength; i++){
console.log(todos[i],i);
}
todos.forEach(function(todo, i) {
console.log(todo, i);
})
Most people might get confused by this part
so let's take out the function and call it 'logTodos'.
function logTodos(todo, i) {
console.log(todo, i);
}
todos.forEach(logTodos);
^It's going to do the exact same thing, but I can now use 'logTodos' in other places.
let's make other array.
var todosImportant = [
"clean room!",
"brushteeth!",
"exercise!",
"study javascript!",
"eat healthy!"
];
var todos = [
"clean room",
"brushteeth",
"exercise",
"study javascript",
"eat healthy"
];
var todosImportant = [
"clean room!",
"brushteeth!",
"exercise!",
"study javascript!",
"eat healthy!"
];
// var todoslength = todos.length;
// for(var i=0; i < todoslength; i++){
// console.log(todos[i]);
// }
function logTodos(todo, i) {
console.log(todo, i);
}
todos.forEach(logTodos);
todosImportant.forEach(logTodos);//added
And we should check that they work on all browsers.
So, if you remember, we had 'caniuse.com', that we use for this.
https://caniuse.com/
and we can also check 'forEach'
Author And Source
이 문제에 관하여(132. loop), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@bianjy/132.-loop저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)