2024/08/09 5

화살표 함수, 조건연산자, 단축평가

함수 선언하는 방법 - function 함수명() {  } - const 변수 = function 함수명 () { } // 이러한 형태가 가능한 이유는 자바스크립트 안에서 참조한 변수들은 // 부모 타입이라고 할 수 있는 상위타입이// object 타입이라고 할 수 있음// 그래서 function() 역시도// 그냥 값으로 취급한다면 이런 표현도 가능 const add = function (a, b) { return a + b; } //  단어' function'를 없앰 // → 매개변수 괄호 우측에 화살표 입력 // →  return이 한 줄인 경우// 중괄호와 return의 키워드가 필요없음 const add = (a, b)=> { return a + b; } const add = (a, b)=> a..

promise, async, await

promise 비동기 작업의 최종 완료 또는 실패 결과에 따라 콜백 함수를 연결할 수 있음 상태 pending (대기중) 초기상태 성공 또는 실패가 결정되지 않은 상태 fulfill (이행됨) 연산이 성공적으로 완료되어 프로미스가 결과값을 반환한 상태 rejected (거부됨) 연산 실패 오류 const myPromise = new Promist(function (resolve, reject) if ( true) { resolve("Seccess"); } else {   reject ("Failed"); } }); then은 성공한 경우 catch는 실패한 경우 async 함수 선언 앞에 붙여 정의 항상 Promise를 반환 async function fetchData() {    return 'Data..

모듈

모듈 관련 함수, 변수, 객체, 클래스 등을 한 파일로 그룹화 한 것 재사용할 수 있는 함수, 객체 또는 원시값export 키워드를 사용해서 모듈 생성 다른 파일에서 사용할 수 있게 함 import 키워드로 다른 파일에서 함수를 불러와 사용 가능자바스크립트의 실행 환경은 브라우저 환경과 Node 환경이 존재 Node 환경에서의 import 방식은 CommonJS 방식과 ES6 방식 존재 React 개발환경은 대부분 ES6에서 게시된 방법 사용여러 스크립트에서 동일한 함수 이름을 사용하더라도 모듈을 사용하면 각 스크립트에서 정의된 함수는 해당 모듈 내에서만 유효 사용하는 이유:    // 위에서 아래로 흐르기 때문에 모듈 시스템 import $ from 'jquery'; // 자동으로 jQuery에 대..

template literals, spread와 rest

spread perators 객체나 배열을 복사할 때 많이 쓰임 배열이나 객체를 합칠 때 많이 쓰임 const originalUser = { name = "조희진" age = 26, };복사해야 할 경우 const updatedUser = originalUser; 복사 X참조하는 위치를 변경 O불변성과도 관련그래서 Spread Operators가 나옴originalUser에 조희진과 26이라는 value를 가지고 있음updatedUser.name = "조은진"; console.log("원본 =>" updatedUser); // name: '조은진', age: 26 console.log("원본 =>" originalUser); // name: '조은진', age: 26 UpdatedUser는 Origina..

template literals 와 destructuring

Template Literals 변수와 표현식을 문자열 안에 쉽게 삽입할 게 해주는 문법백틱(`) 문자열을 여러 줄로 작성하는 목적으로도 사용됨const customer = { name: "인스피릿",    }; const item = { name: 스타크래프트 리마스터 카툰팩"; price: 50, };console.log("감사합니다. " + customer.name + "님!"); // 감사합니다. 인스피릿님! console.log("감사합니다. " + customer.name + "님!" +  item.name + "을(를) +  item.price + "원에 구매하셨습니다."); // 감사합니다. 인스피릿님! 스타크래프트 리마스터 카툰팩을 50원에 구매하셨습니다. console.log(`감사합니..