Introduction to JavaScript (2)

Loop tasks, truthy/falsy

Loop tasks

Task1: Write a loop that makes seven calls to console.log to output the following triangle:

#
##
###
####
#####
######
#######

Solutions:

solution 1 (for loop)
var hash = ''; 
for (i = 0; i <= 7; i++) { 
  hash = hash + '#';      
  console.log(hash);      
}
solution 2 (for loop)
for (hash = '', i = 0; i <= 7; i++) {
  console.log(hash += '#');
}
solution 3 (while loop)
var hash = '';
var i = 0;
while (i <= 7) {
  console.log(hash += '#');
  i++;
}
solution 4 (do while loop)
var hash = '';
var i = 0;
do {
  console.log(hash += '#');
  i++;
}while(i <= 7);

Task2: Write a for loop that will iterate from 0 to 20. For each iteration, it will check if the current number is even or odd, and report that to the screen (e.g. “2 is even”).

Solution:

for (i = 0; i <= 20; i++) {
  if (i % 2 === 0) {
  console.log(i + ' is even');
} else {
  console.log(i + ' is odd');
}
}
or 
for (i = 0; i <= 20; i++) {
  if !(i % 2) {    //inverse logic 'true'
  console.log(i + ' is even');
} else {
  console.log(i + ' is odd');
}
}

Truthy/Falsy

In the solution above (i % 2) (given i is an even number) would return 0 — the reminder.

0 in javaScript is false

So in order to make it work we need to reverse the logic and make sure the condition is always true…

To do that we can add ! before the condition !(i % 2)

or simply by adding === 0 so that (i % 2 === 0) that basically meant false equals false which is true

Other examples with truthy/falsy

In JavaScript, a truthy value is a value that translates to true when evaluated in a Boolean context. All values are truthy unless they are defined as falsy.

Falsy values:

1. false
2. null
3. undefined
4. 0
5. NaN
6. '' empty string
7. document.all

for instance:

var l = (false == 0); // true
var m = (false === 0); // false - this is 'strict equal' so values have to be exactly the same even in writing...
so
var n= (false === false); // true
var o= (0 === 0); // true

All other values are truthy, including “0” (zero in quotes), “false” (false in quotes), empty functions, empty arrays, and empty objects.

Other examples:

var a = !!(0); // variable is set to false
var b = !!("0"); // true
var c = (false == 0); // true
var d = (false == ""); // true
var e = (0 == ""); // true
var f = (null == false); // false
var g = (null == null); // true
var h = (undefined == undefined); // true
var i = (undefined == null); // true
var j = (NaN == null); // false
var k = (NaN == NaN); // false 
//The falsy value NaN is not equivalent to anything — including NaN!

Task3: Write a for loop that will iterate from 0 to 10. For each iteration of the for loop, it will multiply the number by 9 and log the result (e.g. “2 * 9 = 18”).

solution 1
for (i = 0; i <= 10; i++) {
  console.log(i + '*' + ' 9' + ' =' + i * 9);
}
solution 2
var multiplier = 9;
for (var i = 0; i <= 10; i++) {
    var result = multiplier * i;
    console.log(multiplier + ' * ' + i + ' = ' + result);
}

Task4: Write a program that uses console.log to print all the numbers from 1 to 100, with two exceptions. For numbers divisible by 3, print "Fizz" instead of the number, and for numbers divisible by 5 (and not 3), print "Buzz" instead.

When you have that working, modify your program to print "FizzBuzz", for numbers that are divisible by both 3 and 5 (and still print "Fizz" or "Buzz"for numbers divisible by only one of those).

for (i = 0; i <= 100; i++) {
  var number = i + 1
  var result = ''
  if (number % 3 == 0) {
    result = 'Fizz';
  }
  if (number % 5 == 0) {
    result += 'Buzz';
  }
  if (!result) {
  result = i + 1;
  }
  console.log(result);
}

Visit PavKa for previous articles…