JavaScript Method CheatSheet


Method List

1.Object

const obj1 = {
  i1: 1,
  i2: 2,
  i3: 3,
};
const obj2 = {
  i4: 1,
  i5: 2,
  i6: 3,
};

const a1 = Object.keys(obj1)
const a2 = Object.values(obj1)
const a3 = Object.entries(obj1)
const a4 = Object.assign({}, obj1, obj2);

2.String(Wrapper Object)


const s1 = "abc";
const s2 = "ABC";
const s3 = "A,B,C";
const s4 = "   あい  お  ";

const e1 = s1.toUpperCase();
const e2 = s2.toLowerCase();
const e3 = s1.charAt(0);
const e4 = s1.concat(s2);
const e5 = s1.indexOf("a");
const e6 = s1.slice(0, 1);
const e7 = s1.replace("a", "");
const e8 = s3.split(",");
const e9 = s4.trim();

3.Comparison Operator

const list1 = [1, 2, 3, 4, 5, 6];
const d1 = 1;
const d2 = "1";

const e1 = d1 == d2;
const e2 = d1 === d2;
const e3 = d1 != d2;
const e4 = d1 !== d2;
const e5 = d1 === d2 && d1 !== d2;
const e6 = d1 === d2 || d1 !== d2;
const e7 = d1 in list1;

4.List

const list1 = [1, 2, 3, 4, 5, 6];
const list2 = ["1", "2", "3"];

const s1 = list1[1];
list1[1] = 10;

list1.push(4);
const b1 = list1.pop();
const b2 = list1.shift();
const b3 = list1.concat(list2) // 配列のコピーも可

const c1 = list1.map((value) => value + 1);
const c2 = list1.filter((value) => value === 1);
const c3 = list1.slice(0, 1);
const c4 = list1.splice(0, 1);

list1.forEach((value) => {
  console.log(value);
});

Syntax

1.Distructuring Assignment

// 1.オブジェクトを作成
const args = {
  name: "yugen",
  age: 25,
  bool: true,
};
// 2.プロパティ名で分割代入が可能。プロパティ名以外では一般的に展開されないらしい?sa
const { name, age, bool } = args;
// 3.関数の引数に分割代入式に用いる右辺の部分をセットしておく
const func1 = ({name, age, bool})=> {
  console.log(name);
  console.log(age);
  console.log(bool);
}
// 4.関数の引数部分に、オブジェクトを渡す
// 渡すオブジェクトのプロパティ名と、関数の仮引数は一致させておく
func1(args)

2.Rest parameters

// 1.deine list
const l1 = [1, 2, 3, 4, 5];
// 2.define a3 list by rest parameters
const [a1, a2, ...a3] = l1;
console.log(a3) // -> [3,4,5]

3.Argument mandatory or optional

// argument mandatory or optional
// ==============================
// arg1:mandatory
// name, age, city:opional & destructual assignment
const greet = (arg1, { name, age, city }) => {
  console.log(arg1);
  console.log(`${name}, ${age}, ${city}`);
};

const person = {
  name: "Alice",
  age: 30,
  city: "New York",
};

greet("hello!", person);
// ==============================

4.Map Object

// Map Object(any type can set to key)
// ==============================
// constructor by list object
const map1 = new Map([
  ["s1", "s11"],
  ["s2", "s22"],
  ["s3", "s33"],
  [3, 100],
]);

map1.set("s100", 100);
map1.get("s1");
map1.has("s1");
map1.delete("s1");
const g1 = [...map1.keys()]
const g2 = [...map1.values()]
// ==============================

5.Date Object

// Date Object
// ==============================
const b0 = new Date()

console.log(b0.getFullYear());
console.log(b0.getMonth());
console.log(b0.getDate());

console.log(b0.getHours());
console.log(b0.getMinutes());
console.log(b0.getSeconds());
// ==============================


注意点

1.数値と小数点にデータ型の区別がない

typeof(1)
typeof(1.1)
どちらもNumber


この記事が気に入ったらサポートをしてみませんか?