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?
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'!
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--
}
var counterTwo = 10;
do{
console.log(counterTwo);
counterTwo--;
} while (counterTwo>0);
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);
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);
})
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'