Things of interest.

 
 
June 27, 2021

Eloquent Javascript / Chapter 2, Exercise 03


Chessboard - in which I review ternary operators.

Problem

Write a program that creates a string that represents an 8×8 grid, using newline characters to separate lines.

At each position of the grid there is either a space or a “#” character. The characters should form a chessboard.

Passing this string to console.log should show something like this:

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

Discussion

  1. Personally I’m not a fan of the “?” syntax. I think Python’s ternary operator looks cleaner.

  2. It’s possible to use a ternary operator in place of a regular if is possible, but I find it quite unreadable.

Solution

  1. Solution 1: Explicit and repetitive.

     grid_size = 8
     invert = true
    
     for (let row = 0; row < grid_size; row++) {
         row_string = `${row+1} `
    
         if (invert) {
             white = " "
             black = "#"
         } else {
             white = "#"
             black = " "
         }
    
         for (let col = 0; col < grid_size; col++) {
    
    
             if (col % 2 === 0) {
                 row_string += `${white}`
             } else {
                 row_string += `${black}`
             }
         }
         console.log(row_string)
         invert = invert ? false : true
     }
    
  2. Solution 2: cleaner, shorter. The ternary operator here isn’t as readable as an if statement. I also find it quite confusing, since the .reverse() method comes as a statement, and does not mark a return value.

     grid_size = 8
     invert = true
     switches = [" ", "#"]
    
     for (let row = 0; row < grid_size; row++) {
         row_string = `${row + 1} `
         row % 2 === 0 ? switches : switches.reverse()
    
         for (let col = 0; col < grid_size; col++) {
    
             if (col % 2 === 0) {
                 row_string += `${switches[0]}`
             } else {
                 row_string += `${switches[1]}`
             }
         }
         console.log(row_string)
     }
    

 

- Areas: Code / Music / Gaming / Languages
- Lang: Japanese / French / English
- Hume: Law / Work / Learning / People
- All: Tags / Posts / Search
 
© 1997 - 2021 / Info