JS 공부

심재운·2024년 2월 16일

get() { } & set() { }

ES6 이후 JavaScript 부터는 GetterSetter를 간단하게 정의할 수 있다.

getset을 작성하면 되며 예시는 아래와 같다.

const user = {
  name : 'i2max',
  age : 22,
  
  get userName() { // getter
    return user.name;
  },
  
  set userName(val) { // setter
  	user.name = val
  }
}

기존 코드 처럼 userName() { }으로 정의한 경우 user.userName()와 같이 함수를 호출하는 형식이지만,

최신 문법의 경우 일반 프로퍼티처럼 user.userName 으로 접근하면 된다.

(예시)

const cat = { // 기존
  fn:'fn',
  ln:'ln',
  fullName() {
    return this.fn + '' + this.ln;
  }
}

const cat2 = { // 최신
  fn:'fn',
  ln:'ln',
  get fullName() {
    return this.fn + '' + this.ln;
  }
}

// 아래 두 출력값은 같음
console.log(cat.fullName()); // 기존
console.log(cat2.fullName); // 최신

[자바스크립트 Getter & Setter 완벽 정리]

console.assert()

console.assert()는 주어진 가정이 거짓인 경우 메세지를 출력하고, 참인 경우는 아무것도 하지 않는다.

console.assert(1 == '1'); // 아무 작동 X
console.assert(1 === '1'); // 오류 출력

console.assert(true); // 아무 작동 X
console.assert(false); // 오류 출력

[console.assert()]

reduce()

d

includes()

includes()는 문자열이나 배열에 특정 값이 포함되어 있는지를 판별하여 truefalse를 반환한다.

includes(찾는 값);
includes(찾는 값, 검색을 시작할 인덱스);

기본형은 위와 같으며, 예시는 아래와 같다.

const str = "javascript Test";

console.log(str.includes("java")); // true
console.log(str.includes("Java")); // flase

console.log(str.includes("Test")); // true
console.log(str.includes("test")); // false

console.log(str.includes("script", 4)); // "script Test" 에서 script 찾기
console.log(str.includes("script", 5)); // "cript Test" 에서 script 찾기

문자열 - [String.prototype.includes()]
배열 - [Array.prototype.includes()]

더하기 (+) 연산

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Addition

https://lngnat.tistory.com/entry/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%88%AB%EC%9E%90-%EB%AC%B8%EC%9E%90-%EA%B4%80%EA%B3%84-%EC%97%B0%EC%82%B0%EC%9E%90%EB%8A%94-%EB%8D%94%ED%95%98%EA%B8%B0%EA%B0%80-%EC%95%84%EB%8B%88%EB%8B%A4

숫자 표현

let num = 1e3; // 1 * 1000 => 1000
let num2 = 1000;
let num3 = 1_000; // _(언더바) 사용 가능
let num4 = 1_0_0_0; // _(언더바) 사용 가능

console.log(num); // 1000
console.log(num2); // 1000
console.log(num3); // 1000
console.log(num4); // 1000

console.log(num === num2); // true
console.log(num2 === num3); // true
console.log(num3 === num4); // true

eexponential의 의미로 제곱수를 의미로, 자세한 내용은 하단 링크 확인
[[js] e 를 이용한 숫자표기법이 필요한 이유]

Set

[자바스크립트 세트(Set) 완벽 가이드]

Object

function Animal(size, type) {
  this.size = size || "small";
  this.type = type || "Animal";
  this.canTalk = false;
}

let Pet = function (size, type, name, owner) {
  Animal.call(this, size, type);
  this.name = name;
  this.owner = owner;
}

Pet.prototype = Object.create(Animal.prototype);

let pet1 = new Pet();

console.log(pet1);

let pet2 = new Pet("big", "person", "simson", "simsim");

console.log(pet2);

super

class Vehicle {
  constructor (plate, name) {
    this.plate = plate;
    this.name = name;
  }
}

class Truck extends Vehicle {
  constructor (plate, name, weight) {
    super(plate, name);
    this.weight = weight;
  }
  
  displayWeight() {
    console.log(`The truck ${this.plate} has a weight of ${this.weight} lb.`)
    console.log(`${this.name}`)
  }
}

let myTruck = new Truck('123AB', 'name', 5000);

myTruck.displayWeight();

splice & slice

[[자바스크립트] slice와 splice의 차이점에 대해 알아보자]

[[JavaScript] 자바스크립트 Slice()와 Splice()의 차이점]

flat()

[Array.prototype.flat()]

profile
공부는 비효율적으로 하는 게 가장 효율적이다.

0개의 댓글