livlog

The goals 💪🏻What happens behind the scenes of classes and objects? ✌🏻Constructor functions (without classes) 👍🏻Prototype & Prototypical Inheritance class Person { name = 'Max'; constructor() { this.age = 30; } greet() { console.log( "Hi, I am " + this.name + "and I am " + this.age + "years old." ); } } const person = new Person(); person.greet(); function Person() { this.age = 30; this.name = 'M..

The goals 💪🏻What is "Object-oriented Programming" (OOP)? ✌🏻Classes & Instances 👍🏻Properties, Fields & Methods 👏🏻Inheritance Object-literal code Classes & Instances Class in JavaScript A JavaScript class is a blueprint for creating objects. A class encapsulates data and functions that manipulate data. Unlike other programming languages such as Java and C#, JavaScript classes are syntactic sugar o..

The goals 💪🏻What are Objects ✌🏻Objects in JavaScript 👍🏻Adding a Method to Objects 객체 & 원시 값 객체는 참조 값이라는 점은 이미 배우셨습니다. 아직 명확하지 않을 수도 있지만, 객체가 원시 값으로 구성된다는 점을 이해하는 것이 중요합니다. 다음은 예시입니다. const complexPerson = { name: 'Max', hobbies: ['Sports', 'Cooking'], address: { street: 'Some Street 5', stateId: 5, country: 'Germany', phone: { number: 12 345 678 9, isMobile: true } }, }; complexPerson 에 여러 개의 중첩..

The goals 💪🏻Different Ways of Creating Arrays ✌🏻Working with Arrays = A Deep Dive! 👍🏻Important Array Methods 👏🏻Other Iterables: Maps & Sets const numbers = [1, 2, 3]; console.log(numbers); const moreNumbers = new Array(5); console.log(moreNumbers); v With this 'new' it can have another characteristic as we can see above. And we can create an array without 'new' keyword, but still it works the sa..

The goals 💪🏻HTML, DOM & JavaScript ✌🏻Nodes & Elements 👍🏻Querying DOM Nodes & Traversing the DOM 👏🏻Evaluating & Manipulating DOM Nodes 👊🏻Creating & Removing DOM Nodes The Document Object Model (DOM) Node Query Methods 다음은 DOM 요소에 접근하는 다양한 방법에 대한 요약입니다 (참고: 요소 노드에 대해서만 쿼리할 수 있음). 아래의 쿼리 메서드 외에도 문서 객체에 대한 아래의 특수 프로퍼티로 문서의 일부를 선택합니다. document.body => 요소 노드를 선택합니다. document.head => 요소 노드를 선택합니다. docu..

The goals 💪🏻Different Ways of Creating Functions ✌🏻Anonymous Functions 👍🏻Callback Functions & Functions in Functions 👏🏻Default Arguments & Rest Operator 👊🏻Bind() & More What We Already Know Functions are "Code on Demand" Variables and constants created in functions "belong" to that function Functions CAN take parameters (arguments) and CAN return a value Functions can be called multiple times (w..

The goals 💪🏻ES5 vs ES6+ Syntax ✌🏻How JavaScript Works 👍🏻The Weird Parts ES5 vs ES6+ This is mostly important for browser vendors who need to make sure that their JavaScript engine follows this ECMAScript definition Var vs Let vs Const Hoisting JavaScript has a special feature called hoisting which in the end means that the JavaScript engine, the browser when it loads our script, it goes all over..

The goals 💪🏻Conditional Statement (if statements) & Expressions ✌🏻Boolean Values & Operators 👍🏻Loops in JavaScript 👏🏻Error Handling Conditional Code Execution function doSomething() - if (someCondition) Option A: e.g. agg two numbers Option B: e.g. subtract two numbers Boolean Operators Important For Conditional Code: Return true or false ==: Check for value equality e.g. a == b !=: Check for va..

The goals 💪🏻Write Code Efficiently ✌🏻Find Help 👍🏻Debug Your Code Write Code Efficiently Work in a productive environment (i.e. IDE, editor) Auto-format code & use shortcuts Use auto-completion and hints Explore extensions & settings Find Help Use MDN Learn how to google (seriously!) Ask proper questions, help others Trial & Error Debug Your Code Read and utilize error messages Use console.log() ..

The goals 💪🏻Dive into Core Syntax ✌🏻Understand Variables & Data Types 👍🏻Work with Operators 👏🏻Explore & Use Functions Variables & Constants Var Before the advent of ES6, var declarations ruled. There are issues associated with variables declared with var, though. That is why it was necessary for new ways to declare variables to emerge. First, let's get to understand var more before we discuss th..