Front/js
-
promise 처리 흐름 (콜백지옥, Promise, Async/Await)Front/js 2024. 7. 3. 15:53
▤ 목차">HTML 삽입미리보기할 수 없는 소스 자바스크립트는 싱글스레드만 지원한다.기본적으로 여러개의 단위 프로그램(함수, 메서드)를 순서대로 진행한다. => 동기만약 순서대로 들어오는데 중간에 오랜 수행 시간이 필요한 작업이 들어오면 그 뒤에 들어온 작업들은그저 기다려야한다.만약 순차적 작업이 필요한 것이 아니라면 일을 병렬적으로 수행하여 일을 빠르게 처리할 수 있다. =>비동기 ✔ 동기와 비동기프로그램 처리 흐름에 대해 배우기 이전에 동기와 비동기에 대해 정리해보고자 한다.클라이언트의 요청에 어떻게 반응해야할까?⌨ 동기순서가 중요한 경우 사용한다.프로그램을 직렬적으로 수행한다.일이 들어오면 작업이 수행중이라면 다음 작업은 대기하게 된다. 코드로 알아보자.function myProcess(){..
-
js) 배열 정리 (+ 관련 함수)Front/js 2024. 7. 2. 13:52
▤ 목차" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 배열이란 일반적으로 '리스트 객체' 라고 생각하면 편하다.배열은 보통 리스트에 저장된 다수의 값들을 포함하고 있는 하나의 객체이다.여러 개의 기억장소에 대해 대표명(배열명)하나만을 부여하고, 배열명[첨자] 형태로 각 기억장소를 구분한다.반복 처리가 효과적이다. ✔ js 배열은⌨ 형식배열명 = new Array();초기값을 줄 수있지만, 배열을 넘어가면 자동적으로 배열이 확장된다. 💻 코드로 보기let aa= new Array(); //초기값 줄 수 있는데, 늘어나면 알아서 확장된다.aa[0] =10;aa[1] =10.5;aa[3] ='결과로';document.write(`aa[0] : ${aa[0]} aa[1] : ..
-
화살표 함수 ( + 콜백 함수, 재귀함수 )Front/js 2024. 7. 1. 10:48
▤ 목차" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 ✔ 화살표 함수⌨ 형식const sum = (a,b) =>a+b; 자바의 람다와 비슷하다. 화살표는 =>이런 형식을 사용한다.함수 표현식보다 단순하고 간결한 문법(use strict)으로 함수를 만들 수 있다. 💻 코드로 보기const sum1= function(a,b){ return a+b;}console.log(`두 수의 합은 ${sum1(3,4)}`); 위의 코드를 화살표 함수로 사용하면 아래와 같은 코드가 된다. const sum2 = (a,b) =>a+b;console.log(`두 수의 합은 ${sum2(3,4)}`); 👏 파라미터가 1개인 경우함수를 따로 정의하지 않아도 실행문을 만들 수 있다.만약 아..
-
js 함수(Function)에 대한 정리( + 클로저함수, 중첩함수, 렉시컬 스코프, 콜스택, 활성 함수)Front/js 2024. 6. 28. 19:58
▤ 목차" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 ✔ 함수다른 객체처럼 속성 및 method를 가질 수 있기에 일급(first-class) 객체이며 인자를 가질 수 있는 코드 블록을 말한다.함수는 자체 범위를 가진다.**부모 함수의 지역 변수에 접근할 수 있다.(closure)** ⌨ 역할호출 가능한 루틴으로서의 함수이다.값으로서 함수(인자로 전달, 변수에 의한 할당 가능, 어떤 함수의 반환값으로 사용 _ 일급객체)객체 타입으로 함수 💻 특징변수 안에 담길 수 있다.객체의 속성안에 method로 담길 수 있다.다른 함수의 인자값을 전달될 수 있다.함수의 return값으로 사용할 수 있다.배열의 값으로 사용할 수 있다. 👏 사용 이유코드를 재사용할 수 있다.(코드를..
-
js 원시 타입과 참조 타입, 연산자 정리Front/js 2024. 6. 27. 11:44
▤ 목차" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 ✔ 동적 타입⌨ 코드로 보기let aa = 42; // aa는 이제 숫자aa = "bar"; // aa는 이제 문자열aa = true; // aa는 이제 불리언 자바스크립트는 동적 타입이 있는 동적인 언어이다.변수를 선언할때 특정 타입으로 선언하지 않는다. 모든 타입의 값으로 할당이 가능하다.재 할당 또한 가능하나.일치하지 않는 타입이 포함된 경우 암시적으로 타입 변환이 가능하다. 위의 특징은 형변환이 편리하다는 장점이 있지만 주의해야하는 상황이 있다.document.write('', '1' + 2); //12이런 경우,2의 숫자가 자동으로 형변환이 된다.코드로 확인해보자. 개발자가 변환을 수행할 의도가 없다면 잠재..
-
변수 선언 var, let, const 차이점과 호이스팅Front/js 2024. 6. 24. 15:48
▤ 목차" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 ✔ var, let, const 변수 선언⌨ 형식var a=5;let b=10;const c=a+b; js는 변수타입을 지정해주지 않아도 값에 따라 자동으로 변수의 타입을 지정해준다.하지만 변수에 var, let, const를 사용할 수 있다.숫자, 특수문자로 시작하면 안된다.클래스가 아닌 변수는 소문자를 사용한다.(관례) 💻 const 는 상수 값const로 선언된 변수는 상수값으로 자바에서 final 키워드와 비슷하다.변수 재선언, 변수 재할당이 모두 불가능하다. ✔ let과 var 차이 ⌨ 반복 선언var a = '하하호호';var a = '하하하 호호호'; 같은 변수명에 선언했음에도 에러가 나오지 않..