Nothing beats Fundamentals -Javascript fundamentals A developer released a JavaScript fundamentals collection called 'JavaScript By Example' to help both beginners and seniors refresh core concepts. The project provides concise examples covering values, variables, conditionals, loops, functions, and closures, with production-grade tips on syntax caveats. The developer built the resource to counter over-reliance on AI coding assistants. Hi, lately i've been using AI Coding assitant intensively, i always worry that i might lost my edge relying too much on AI Hence i decided, to release Javascript fundamentals that Beginner and Senior can read through on daily basis, to enhance more knowledge on javascript fundamentals. Content below are based on: Click to open: Javascript By example https://www.softwarejutsu.com/jsbyexample I build Javascript collections of fundamental concepts and syntax, presented as concise as possible using examples . Pages developed to provide you on-the-go experience, so you can pickup and resume honing your fundamental anwhere with your phone. Extra, I provided "In production" section, where you can get production-grade tips on the specific syntax's caveats based on my experience or industry best practice, Here is Fundamental of Javascripts for your refresher: The simplest JavaScript program: printing something to the console. console.log "Hello, World " ; Good for understanding how JavaScript code starts running. ⸻ Values are the actual data JavaScript works with, such as strings, numbers, booleans, objects, null, and undefined. "hello"; // string 42; // number true; // boolean null; // empty value undefined; // missing value JavaScript has primitive values and object values, and knowing the difference helps avoid weird bugs. ⸻ Variables store values so they can be reused later. js let name = "Rick"; const language = "JavaScript"; var oldStyle = "avoid when possible"; In modern JavaScript, let and const are usually preferred over var. Var is function scope. let and const are block scope. ⸻ const prevents reassignment, but it does not make objects or arrays immutable. js const user = { name: "Rick" }; user.name = "Aldi"; // allowed // user = {}; // not allowed This is important because const protects the variable binding, not the internal value. ⸻ JavaScript numbers are floating-point numbers by default. js const price = 0.1 + 0.2; console.log price ; // 0.30000000000000004 This is why money calculation should be handled carefully in production. Use BigInt for large number, for fraction please use the number as the smallest unit of whatever you dealing with e.g storing value of 1 dollar as 100 cent instead ⸻ Strings represent text. js const name = "Rick"; console.log Hello, ${name} ; Template literals make string interpolation much cleaner than manual concatenation. ⸻ Booleans represent true or false. js const isLoggedIn = true; if isLoggedIn { console.log "Welcome back " ; } JavaScript also has truthy and falsy values, which affect how conditions behave. ⸻ Conditionals let your program make decisions. js const score = 80; if score = 90 { console.log "Excellent" ; } else if score = 70 { console.log "Good" ; } else { console.log "Keep practicing" ; } You use conditionals almost everywhere: validation, rendering, permissions, and business logic. ⸻ Loops repeat work. js const items = "apple", "banana", "orange" ; for const item of items { console.log item ; } Different loops solve different problems: for, for...of, for...in, and forEach. ⸻ Functions group reusable logic. function greet name { return Hello, ${name} ; } console.log greet "Rick" ; They help you avoid repeating the same logic everywhere. ⸻ Arrow functions provide shorter syntax and lexical this. js const add = a, b = { return a + b; }; console.log add 2, 3 ; They are great for callbacks, but not always ideal for object methods that need their own this. ⸻ A closure happens when a function remembers variables from its outer scope. js function createCounter { let count = 0; return function increment { count++; return count; }; } const counter = createCounter ; console.log counter ; // 1 console.log counter ; // 2 Closures are useful for private state, factories, and memoization. ⸻ Arrays store ordered lists of values. js const numbers = 1, 2, 3 ; const doubled = numbers.map number = number 2 ; console.log doubled ; // 2, 4, 6 Common array methods include map, filter, reduce, find, and some. ⸻ A higher-order function accepts another function or returns one. js function runTwice callback { callback ; callback ; } runTwice = { console.log "Running" ; } ; This pattern powers array methods, event listeners, middleware, and async workflows. ⸻ Objects store key-value pairs. js const user = { name: "Rick", role: "Developer" }; console.log user.name ; Objects are one of the most important structures in JavaScript because most real-world data is object-shaped. ⸻ Map stores key-value pairs, while Set stores unique values. js const uniqueIds = new Set 1, 2, 2, 3 ; console.log uniqueIds ; // Set 3 { 1, 2, 3 } Use Set when you need deduplication, and Map when object keys are not flexible enough. ⸻ Modules let you split code across files. js // math.js export function add a, b { return a + b; } // app.js import { add } from "./math.js"; console.log add 1, 2 ; Modules make code easier to organize, reuse, and test. ⸻ Promises represent work that finishes later. js async function fetchUser { const response = await fetch "/api/user" ; const user = await response.json ; return user; } async/await makes asynchronous code easier to read, but you still need to understand concurrency and error handling. ⸻ Classes are syntax for creating objects with shared behavior. class User { constructor name { this.name = name; } greet { return Hello, ${this.name} ; } } const user = new User "Rick" ; console.log user.greet ; // Logs: "Hello, rick" const variableGreet = user.greet console.log variableGreet // Logs: "Hello, undefined" The tricky part is often not the class itself, but how this behaves when methods are passed around. ⸻ Recursion is when a function calls itself. function countdown number { if number === 0 { return "done"; } return countdown number - 1 ; } console.log countdown 3 ; Recursion is useful for trees, nested data, and repeated problems that can be broken into smaller versions of themselves. ⸻ Dates represent time in JavaScript. js const now = new Date ; console.log now.toISOString ; In production, dates can become tricky because of time zones, formatting, and storage formats. ⸻ DOM manipulation means reading or changing the HTML document with JavaScript. js const title = document.querySelector "h1" ; title.textContent = "Updated title"; This is how JavaScript changes what users see in the browser. ⸻ Events let JavaScript respond to user actions. js const button = document.querySelector "button" ; button.addEventListener "click", = { console.log "Button clicked" ; } ; Clicks, typing, scrolling, and form submissions are all handled through events. ⸻ Form validation checks user input before submitting it. js const email = ""; if email { console.log "Email is required" ; } Client-side validation improves user experience, but the server must always validate again. ⸻ Debounce delays a function until rapid calls stop. js function debounce callback, delay { let timer; return function ...args { clearTimeout timer ; timer = setTimeout = { callback ...args ; }, delay ; }; } const search = debounce keyword = { console.log "Searching:", keyword ; }, 500 ; Useful for search inputs, resize handlers, and expensive operations triggered too often. ⸻ Accessibility means making interfaces usable by more people, including keyboard and screen reader users.