Blogs

JavaScript cheat sheet

2025-02-26 3 mins

Javascript Js Programming Language Study Cheatsheet

Table of Contents

Style

Indent: 2 space.

Naming

Variable: myVariable camelCase.
Function: myFunction camelCase.
Class: MyClass PascalCase.
Closure: makeMyClosure prefix “make”.

Type

Number
BigInt
String
Boolean
Symbol
null
undefined
Object
Array
Function
Date
RegExp
Map
Set

Operator

Truthy, Falsy
- Falsy: false, 0, -0, "", null, undefined, NaN
1 == “1” true
1 === “1” false
!= !== ++ -- += -=
!!X : boolean(X)
&& || !
"hello" && 0 = 0
"hello" && "world" = "world"
"hello" || null = "hello"
"hello" || "world" == "hello"
Condition ? Expr1 : Expr2
- If Condition is true then Expr1, else Expr2.
A ?? B
- If A is null or undefined, then B, else A.
...X
[...myArr1, ...myArr2]
- Unpacking(Array, String, Set, Map, Object)

Declaration

1
2
let hello = "hello";
const world = "world";

String

1
2
let myStr = "hello" + world + `${world}`;
let myRegex = /abc/;

String Methods

Return new String

.toUpperCase()
.toLowerCase()
.trim()
.repeat(N)
.replace(X, Y)
.slice(Start, End)
.split(X)

Return Boolean, Number

.indexOf(X)
.includes(X)
.startsWith(X)
.endsWith(Str)

Array

1
2
3
4
5
const myArray = new Array();
const myArray = [1,2,3,];
const myArray = new Array(3);  // [undefined, undefined, undefined]

[a,b] = [b,a]  // Swap

Array Methods

Edit original

.push(X)
.pop()
.unshift(X)
.shift()
.splice(Start, DeleteCount)
.sort(Callback)
.reverse()

Return new Array

.map(Callback)
.find(Callback)
.filter(Callback)
.reduce(Callback, InitialValue)
.concat(myArr2)
.join(Separator)
.slice(Start, End)

Return Boolean, Number, nothing

.indexOf(X)
.includes(X)
.length
.forEach((number, index) => {}) === for (i in arr){}

Object

1
const myObject = new Object();

Object Methods

Return Array

.keys()
.values()
.entries()

Return Boolean

.hasOwnProperty(X)

Map

1
const myMap = new Map();

Map Methods

Edit original

.set(Key, Value)
.delete(Key)
.clear()

Return Boolean, Value

.get(Key)
.has(Key)
.size

Set

1
const mySet = new Set();

Set Methods

Edit original

.add(X)
.delete(X)
.clear()

Return Boolean, Value, nothing

.has(X)
.size
.forEach()

Basic

1
2
3
console.log("hello world!");

let inputText = prompt("input text: ", hello + world);

1
2
3
4
if (true) {
} else if (false) {
} else {
}

1
2
3
4
5
switch (number) {
  case 1:
    break;
  default:
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
for (let i of foo) {
    // i: object, value
} 

for (let i in foo) {
    // i: property, key
} 

for (let i = 0; i < 5; i++) {
}

1
2
3
4
5
while (i < 10) {
}

do {
} while (i < 10);

Function

1
2
3
4
5
6
7
function myFunction1(a = 10, ...numbers) {
  return 1;
}

(function () {})();

const myFunction2 = () => {};

Class

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
class MyClass {
  #privateProperty = "Can't use outside.";
  static staticProperty = "Can use like MyClass.staticProperty";

  constructor(name) {
    this.name = name;
  }
  myMethod() {}
  #privateMethod() {}
  static staticMethod() {}
}

class ChildClass extends MyClass {
  constructor() {
    super();
  }
}

Other Technic

1
2
const counter = () => (counter.count = (counter.count || 0) + 1);
const sum = (...args) => args.reduce((x, y) => x + y, 0);

Closure

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
function makeMyClosure() {
  let outerFuncVar = 0;

  return function () {
    // Inner Function
    return outerFuncVar;
  };
}

const myClosure = makeMyClosure();
console.log(myClosure());

DOM

document

.getElementById()
.querySelector() // Tag.Class#Id
.createElement()

const div = document.querySelector("div");

div.innerText = "hello";
div.appendChild()

Event

.addEventListener(Event, Handler);

Import

In HTML

1
2
3
4
{% raw %}
<script type="text/javascript" src="myScript.js"></script>
<script type="module" src="main.js"></script>
{% endraw %}

ES6

1
2
import { exportVar as myVar, exportFunc } from "./myModule.js";
import someVar from "./myModule.js";

Node.js

1
const express = require('express');