FrontEnd/JavaScript

1.SymbolSymbol은 ECMAScript 2015 (ES6)에서 도입된 새로운 원시 데이터 타입 중 하나입니다.Symbol은 주로 객체 속성의 고유한 식별자를 만들기 위해 사용됩니다. Symbol은 다른 데이터 타입과 달리 고유하고 변경 불가능한 값이며, 동일한 설명(문자열)을 사용해 생성된 Symbol이라도 서로 다른 고유 값을 가집니다.const mySymbol = Symbol();   2.Symbol 특징2-1.고유성Symbol은 항상 고유한 값을 가지므로, 같은 설명을 사용하여 생성된 Symbol도 서로 다릅니다.const sym1 = Symbol('description');const sym2 = Symbol('description');console.log(sym1 === sym2); //..

1.모듈JavaScript 모듈은 코드의 특정 기능을 독립된 단위로 캡슐화한 파일 또는 파일의 일부를 의미합니다. 모듈은 다른 코드와 독립적으로 작성되고 테스트되며, 필요에 따라 가져와서 사용할 수 있습니다. 이를 통해 코드의 재사용성과 유지 보수성을 높이고, 코드의 구조를 체계적으로 관리할 수 있습니다.   2. 사용이유2-1.독립성모듈은 독립된 파일로 존재하며, 각 모듈은 자체적인 스코프를 가집니다. 따라서 변수 이름이나 함수 이름이 겹치더라도 충돌이 발생하지 않습니다.  2-2.재사용성한 번 작성한 모듈은 여러 프로젝트에서 재사용할 수 있습니다. 2-3.캡슐화모듈 내의 구현 세부 사항은 외부에 노출되지 않으며, 오직 필요한 인터페이스만 공개됩니다.  2-4.의존성 관리모듈은 다른 모듈을 가져와서 사..

1. 클래스class Person { // constructor(생성자) constructor(name) { this._name = name; } //메소드 sayHi() { console.log(`Hi! ${this._name}`); }}    2.인스턴스 생성new 연산자와 함께 클래스 이름을 호출한다.// 인스턴스 생성const human = new Person('Park');human.sayHi();    3.생성자this는 클래스가 생성할 인스턴스, _name은 클래스 필드입니다.constructor(name) { this._name = name;}  4.클래스 필드클래스 몸체에는 메소드만 선언할 수 있다. constructor 내부에서..

1. 프로퍼티 축약프로퍼티 값으로 변수를 사용하는 경우, 프로퍼티 이름을 생략할 수 있다.let x = 1, y = 2;// ES5var obj = { x: x, y: y};// ES6const obj = { x, y };   2.프로퍼티 키 동적 생성 객체 리터럴 내부에서 프로퍼티 키를 동적으로 생성할 수 있다.let i = 0;// ES5obj2[++i] = i;obj2[++i] = i;obj2[++i] = i;// ES6const obj1 ={ [`${++i}`]:i, [`${++i}`]:i, [`${++i}`]:i,}    3.메소드 축약 표현메소드를 선언할 때, function 키워드를 생략한 축약 표현을 사용할 수 있다.var obj4 = { // ES5 ..

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.매개변수 기본값할당ES6에서는 매개변수 기본값을 사용하여 함수 내에서 수행하던 인수 체크 및 초기화를 간소화할 수 있다.function sum(x,y){ x=x||0; y=y||0; return x+y;}//ES6function sum2(x=0,y=0){ return x+y;}  2.REST 파라미터매개변수 이름 앞에 세개의 점 ...을 붙여서 정의한 매개변수함수에 전달된 인수들의 목록을 배열로 전달받음function sum3(...rest){ let sum=0; for(let i=0;i    3.Spread 문법대상을 개별 요소로 분리한다.function sum4(a,b,c){console.log(a+..

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.화살표 함수간략하게 함수를 선언시킨다.(x, y) => { ... } 방식으로 선언     🎈참고자료https://poiemaweb.com/es6-arrow-function

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.템플릿 한번에 여러줄의 문자열을 입력받을수있다. ` 를 사용한다.

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.letvar키워드를 통한 함수레벨 스코프를 가지는것 대신 let 키워드를 사용하여다른 언어처럼 블록레벨 스코프를  지원할수있다.    2.const상수를 위해 사용(재할당 불가능 = 선언과동시에 할당)블록레벨 스코프를 갖는다하지만 const의 타입이 객체일때 객체의 프로퍼티는 변경가능하다.const me={age:20};me.age=10;document.write(me.age+"")    🎈참고자료https://poiemaweb.com/es6-block-scope