O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

Intro to JavaScript - Week 3: Control Statements

54 visualizações

Publicada em

Intro to Programming with JavaScript Seminar, Fall 2017 semester
Week 3: Control Statements (Conditionals & Loops)

Led by Jeongbae Oh, in conjunction with YCC (Yonsei Computer Club) @ Yonsei University

This seminar intends to introduce newcomers to programming using JavaScript, one of the most versatile languages of the modern world.

Publicada em: Tecnologia
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Intro to JavaScript - Week 3: Control Statements

  1. 1. Introduction to Programming with JavaScript Week 3: Control Statements Jeongbae Oh YCC JavaScript Seminar 2017.10.30
  2. 2. Flow • In principle, JavaScript code is executed from top to bottom. • Control statement changes the way ("flow") code is executed. • Control statement consists of conditionals
 (조건문) and loops (반복문).
  3. 3. Conditional • Conditionals work as "branches" of the flow according to the specified condition. • if...else • switch • try...catch
  4. 4. if...else • if...else statement executes specific blocks of code according to a set of pre-defined conditions. • First condition can be written: if(condition) { ... } • Next condition can be written: else if(condition) { ... } • If there's no next condition: else { ... } • At the end, any remaining possible conditions go to else • Since code is executed from top to bottom, conditions need to be arranged carefully not to be overridden.
  5. 5. if...else Example of if statement Poorly designed if statement (condition n === 0 is overridden by n < 1)
  6. 6. switch • switch is a special form of conditional with definitely set conditions. • switch is useful when the conditions are set and will not be changed. 
 (A classical use of switch is days of week) • A break statement, which stops the control statement, is necessary at the end of each case to stop the flow. • default case works similarly as else. • For each case statement, braces are not used.
  7. 7. switch • If break statement is not used, code will continue to be executed. • Not using break statement results in unwanted side effect (triggering of multiple cases).
  8. 8. switch • break can deliberately omitted to achieve a special effect or just make code simpler. • Unlike if, "order" of cases is not important.
  9. 9. try...catch • try...catch is a special form of conditional that is specifically used to debug. • Code inside try will be executed without raising the error. • If there is an error, the program does not end and breaks to catch.
  10. 10. try...catch • Argument e is an error object. • e.name and e.message can be used to identify the type of error occurred when the error is not raised by computer. Program ends due to error raised. Program continues to run; error is printed to console manually.
  11. 11. Errors • In programming, there are three types of errors: • Syntax error: incorrect syntax (e.g. missing ending parenthesis) • Semantic error: incorrect usage 
 (e.g. using == when === should be used) • Logic error: incorrect logic
 (i.e. wrongly designed code giving unintended results) • Only syntax error can be detected by interpreter/debugger. Semantic and logic error must be debugged manually by programmer.
  12. 12. Common Errors • Common errors that can be detected by catch statements: • ReferenceError: 
 e.g. undefined variables • SyntaxError: 
 e.g. missing quote • TypeError: wrong usage of types
  13. 13. try...catch • throw is used to define a custom error that is not built in to the JavaScript interpreter. • finally is used to finish running the entire statement even after an error has occurred.
  14. 14. Loop • Loops repeats the block of code until the specified conditions are met. • while, do...while • for, for...in
  15. 15. while • while repeats the code in the block while the condition is true.
 (i.e. until the condition is false)
  16. 16. while • while without proper ending condition will result in an infinite loop. • But it's not a stack overflow.
  17. 17. do...while • do...while is similar to while, except the code is executed first and the condition is checked afterwards. • This ensures that the code will be executed even when the ending condition is already met.
  18. 18. for • for repeats the code in the block for the specified condition. • First expression: Starting condition
 (Initialize i as 0) • Second expression: Ending condition
 (Continue loop while i is greater than 0) • Third expression: What to do to starting condition
 (After each loop, subtract 1 from i) • Any variable can be used, but i is most often used.
  19. 19. for...in • for...in iterates over an object or an array (an "iterable") • Objects and arrays will be covered in week 4.