MapleStory Finger Point
[JavaScript] Private Class Fields (#)
·
🦎 JavaScript
class의 속성(property)들은 public하며 class외부에서 읽히고 수정될 수 있지만ES2019에서 #을 추가해 private class 필드를 선언할 수 있게 되었다. Private Instance Fields (#변수)"내 차 대시보드 안의 잠긴 서랍"new Car()로 뽑은 내 자동차(인스턴스)만이 가질 수 있는 비밀 데이터이름 앞에 반드시 # 을 붙여야함 (이게 자물쇠야!)밖에서는 절대 못 열음 (car.#secret 하면 에러 뻥!)반드시 클래스 맨 윗줄에 "나 이거 쓸 거야"라고 선언해야함class Car { #fuel; // 1. 선언 (자물쇠 달린 연료통) constructor() { this.#fuel = 100; // 2. 내 차니까 접근 가능 }}const my..
📌자바스크립트 치트시트 (반복 메서드 추가!) 📌
·
🦎 JavaScript
split (자르기)텍스트를 구분자를 기준으로 분리해 배열에 담아 변환구분자에는 문자열 가능, RegExp객체도 가능(But 문자열을 정규표현식으로 간주하지 않음) 옵션인 두번째 매개변수는 반환 받을 배열의 크기를 지정하는 숫자let colorText = "red, blue. green, yello";let colors1 = colorText.split(","); // ["red", "blue", "green", "yellow"];let colors2 = colorText.split(",", 2); //["red", "blue"];let colors3 = colorText.split("[^\,]; // ["",",",",',",",""] *split() 메서드 내의 정규 표현식 지원은 브라우저마다 다르다..
[자바스크립트] 객체 지행 프로그래밍
·
🦎 JavaScript/JavaScript
객체지향언어프로퍼티와 메서드를 가지는 객체를 여러개 만든다. 프로퍼티와 메서드는 이름으로 구별하며 값에 대응한다. 객체는 이름-값쌍의 그룹각 값은 테이터나 함수가 될 수 있다. 모든 객체는 참조 타입을 바탕으로 생성한다. 객체를 이해해보자객체를 만드는 가장 단순한 방법Object의 인스턴스를 만들고 프로퍼티와 메서드를 추가하는 방법let person = new Object();person.name = "Nicholas";person.age = 29lperson.job = "Software Engineer";person.sayName = function() { alert(this.name);}; 객체: personname, age, job => 3가지 프로퍼티sayName() => 메서드sayName(..
try-catch문
·
🦎 JavaScript/JavaScript
try { // 에러가 생길 수 있는 코드} catch (error) { // 에러가 생겼을 때 할일}try절에서 에러가 생기면 코드 실행을 즉시 멈추고 catch 절을 실행 catch 절은 에러에 대한 정보를 담은 객체를 받는다. finally 절try-catch는 옵션으로 finally절 사용 가능finally절의 코드는 항상 실행된다. 에러가 없어도, catch절을 실행하더라도 finally절은 실행된다. 에러 반환try catch문의 throw연산자는 언제든 커스텀 에러를 반환 가능throw 연산자에는 반드시 값이 필요하지만 값의 타입에는 제한이 없다.throw 12345;throw "Hello World";throw true;throw {name:"JavaScript"} try 연산자를 사용하면..
[JavaScript] 비동기/동기 개념: 헷갈림 종결! Crush Time!
·
🦎 JavaScript/JavaScript
1. 동기 (Synchronous) 작업 요청 후, 해당 작업의 완료 또는 처리 결과를 받을 때까지 다음 작업을 기다리는(Blocking) 처리 방식이다.Blocking (결과를 기다리는 상태)2. 비동기 (Asynchronous)작업 요청 후, 해당 작업의 완료를 기다리지 않고(Non-Blocking) 즉시 다음 작업을 수행하는 처리 방식이다. Non-Blocking (결과 기다리지 않는 상태)3. 적용 상황: 동기/비동기 선택 기준프로그래밍 시 두 방식 중 하나를 선택하는 기준은 효율성뿐만 아니라 작업 간의 의존성이다.동기 사용 (필수): 이전 작업의 결과가 다음 행동에 필수적인 영향을 미칠 때 사용한다. 예를 들어, 계좌 이체 시 인출(A) 결과를 확인한 후 송금(B)을 진행해야 하며, 인출 오류 ..
상속 체인
·
🦎 JavaScript/JavaScript
클래스들 사이에서 "누가 누구의 특성과 기능을 물려받는지"를 타나내는 관계의 연결고리ex모든 노드가 기본 클래스인 Node로부터 상속받는다고 하면,Node는 가장 위에 있는 부모 클래스가 된다.그런데 만일 어떤 클래스가 Node로부터 상속받은 후, 그 클래스에서 또 다른 클래스를 만들어 기능을 추가하거나 수정한다면, 두 클래스 사이에도 상속 관계가 형성된다.이처럼 여러 단계로 이어진 상속 관계 전체를 상속체인이라고 한다. 상속체인은 클래스가 자신의 기능을 재상용하고 확장하기 위해 어떤 순서로(어떤 "가족" 관계로) 연결되어 있는지를 보여주는 일종의 계보 역할이라고 할 수 있다.  Node: 모든 클래스의 근간이 되는 최상위 클래스  Intermediate Node: Node로부터 상속받아 기능을 확장한 ..
[JS] DOM조작
·
🦎 JavaScript/JavaScript
[JS] 숫자 배열 정렬
·
🦎 JavaScript/JavaScript
return 0보다 작은걸 반환한다.return > 0, B, A (switch order)  오름순서는 작은 숫자에서 큰 숫자로 가는 것 의미// Stringsconst owners = ['Jonas', 'Zach', 'Adam', 'Martha'];console.log(owners.sort());console.log(owners);//Numbersconsole.log(movements);// return 0, B, A (switch order)// Ascending/*movements.sort((a, b) => { // a-b임. if (a > b) return 1; // 긍정적 if (a a - b);// a가 b보다 클 경우 양수라는 걸 알고 있음// 즉, 양수 반환console.lo..
[JS] 간단하게 알아보는 some, every, filter 차이!
·
🦎 JavaScript/JavaScript
비슷하면서도 다른 some, evey, filter의 차이에 대해 알아보자! ✨const numbers = [1, 2, 3, 4, 5];some - 조건에 하나라도 맞으면 true 반환some은 배열에서 조건을 만족하는 요소가 하나라도 있으면 true를, 아니면 false를 반환한다.const hasEven = numbers.some(num => num % 2 === 0);console.log(hasEven); // true (짝수 2, 4가 있기 때문) 그렇다면 언제 사용할까? 🤔특정 조건을 충족하는 항목이 하나라도 있는지 확인할 때 유용하다.evey - 모든 요소가 조건에 맞으면 true반환every는 배열의 모든 요소가 조건을 만족해야 true를, 하나라도 불만족하면 false를 반환한다.cons..