JavaScript Essential Training

JavaScript Essential Training

JavaScript is a scripting language of the web. As the web evolves from a static to a dynamic environment, technology focus is shifting from static markup and styling—frequently handled by content management systems or automated scripts—to dynamic interfaces and advanced interaction. Once seen as optional, JavaScript is now becoming an integral part of the web, infusing every layer with its script.Through practical examples and mini-projects, this course helps you build your understanding of JavaScript piece by piece, from core principles like variables, data types, conditionals, and functions through advanced topics including loops, and DOM scripting. Along the way, instructor Morten Rand-Hendriksen provides challenges that allow you to put your new skills to the test.


  • 英文名称:JavaScript Essential Training
  • 时长:5小时29分
  • 字幕:英语


  1. JavaScript: The soil from which the modern web grows
  2. How to use the exercise files
  3. JavaScript: First contact
  4. Navigating the JS landscape
  5. Tools for working with JavaScript
  6. Linting and formatting
  7. Get to know the browser console
  8. JavaScript language basics
  9. Learning JavaScript backward
  10. JavaScript in an HTML document
  11. JavaScript as an external file
  12. Modern JavaScript loading
  13. JavaScript modules
  14. Objects: A practical introduction
  15. JavaScript objects: The code version
  16. Object containers
  17. Object properties
  18. Accessing objects
  19. Accessing object properties
  20. Practice: Build a new object
  21. Object methods
  22. Practice: Build a new method
  23. Classes: Object blueprints
  24. Object constructors
  25. Practice: Build a new object with a constructor
  26. Global objects
  27. Challenge: Create a new object type
  28. Solution: Create a new object type
  29. Mix text and variables with template literals
  30. Traditional string output
  31. DOM: The Document Object Model
  32. Access elements with querySelector methods
  33. Access elements using older methods
  34. Practice: Find an element
  35. Modifying element classes
  36. Attributes
  37. Inline style
  38. Practice: Modify classes and attributes, and styles
  39. Add DOM elements
  40. Challenge: Add a new element
  41. Solution: Add a new element
  42. Variables: Containers for everything
  43. Var
  44. Scope
  45. Let
  46. Const
  47. Data types
  48. Assignment vs. comparison
  49. Math operators
  50. Arrays explained
  51. Arrays in code
  52. Array methods
  53. Challenge: Build and modify an array
  54. Solution: Build and modify an array
  55. The real-world function
  56. Functions and methods
  57. A standard function
  58. The arrow function
  59. Arrow functions and "this"
  60. Practice: Build a function
  61. Pass data to a function with parameters
  62. Return values from a function
  63. Practice: Pass values between functions
  64. Callbacks
  65. Conditional if...else statement
  66. Logical operators
  67. Conditional switch statement
  68. Looping through content
  69. Using the map() array method
  70. Challenge: Build an advanced function
  71. Solution: Build an advanced function
  72. DOM events explained
  73. Typical DOM events
  74. Event listeners
  75. Practice: Experiment with event listeners
  76. Advanced event listeners and "this"
  77. Pass arguments through event listeners
  78. Challenge: Create an event listener
  79. Solution: Create an event listener
  80. Troubleshooting JavaScript in the browser
  81. Making sense of a React component
  82. Next steps on your learning journey