minlog
article thumbnail
TypeScript 사용하기
FrontEnd/Javascript 2023. 11. 14. 23:09

1. TypeScript 란? 자바스크립트는 동적 타입의 언어로 실행시에만 오류를 발견할 수 있습니다. 하지만 타입스크립트는 정적 타입의 컴파일 언어로 코드 작성 단계에서 타입을 체크해 오류를 확인 할 수 있고 미리 타입을 결정하여 실행 속도가 빠르다는 장점이 있습니다. 타입스크립트는 앞서 말했든 컴파일 언어로 자바스크립트로 다시 변환해야 사용이 가능합니다. 2. TypeScript 설정 2-1. TypeScript 설치 npm install -g typescript 2-2. TypeScript 파일 생성 ts 확장자를 사용하여 생성. 파일명.ts 3. TypeScript -> script 컴파일 3-1. 기본 컴파일 ts파일을 html파일에 붙혀서 사용하려면 스크립트 파일로 변환이 필요하다. 변환시 E..

[ Javascript ] Promise - 비동기 패턴 객체 사용
FrontEnd/Javascript 2023. 8. 19. 11:19

Promise - 비동기 패턴 객체 사용 1. 비동기 패턴 1-1. 콜백함수 callback 함수는 a라는 로직 이후에 실행 되는 로직을 말한다. 함수의 인수로 사용되는 함수를 콜백함수 실행 순서 보장 function a(callback){ // 1. 함수 setTimeout(()=>{ console.log("a"); callback() // 2. 콜백함수의 실행 위치 },1000) } function b() { console.log("b") } a (function (){ // 3. 콜백함수 = a 함수의 인수로 사용되는 function 함수 b() }); 1-2. 콜백지옥 (연이은 콜백함수의 사용) 순차적으로 콜백함수를 사용할때 > 이와 같은 모양이 나타나게 된다. 다음 순서를 보장은 하지만 관리가 ..

[ Javscript ] 정규표현식 RegExp
FrontEnd/Javascript 2023. 8. 15. 15:34

정규표현식 (RegExp) 정규식, Regular Expression 역할 문자 검색 문자 대체 문자 추출 테스트 사이트 https://regexr.com/ 정규식 생성 //생성자 new RegExp('표현'.'옵션'); new RegExp('[a-z]'.'gi'); //리터럴 /표현/옵션 /[a-z]/gi 예제 문자 const str = ` 010-1234-1234 aaathe@naver.com The quick brown fox jumps over the lazy dog. aaabbcccddddaaathe. `; 메소드 메소드 문법 설명 test 정규식.test(문자열) 일치여부 (Boolean) 반환 match 문자열.match(정규식) 일치..

[ Javascript ] Storage 활용
FrontEnd/Javascript 2023. 8. 14. 18:44

Stroage 활용 key, value 형태로 저장된다. stroage에는 Local Stroage와 Session Stroage가 존재한다. Window.localStorage - Web API | MDN localStorage 읽기 전용 속성을 사용하면 Document 출처의 Storage 객체에 접근할 수 있습니다. 저장한 데이터는 브라우저 세션 간에 공유됩니다. localStorage는 sessionStorage와 비슷하지만, localStorage의 데이 developer.mozilla.org 1. Session Stroage 페이지 세션이 끝날때 사라진다. (브라우저 닫을때) 2. Local Stroage 스토리지 객체에 접근 할수 있고 브라우저 세션 간에 공유된다. 데이터가 만료되지 않는다...

[ Javascript ] Lodash 기능 사용하기
FrontEnd/Javascript 2023. 8. 14. 18:01

Lodash 기능 사용하기 기본 통로를 사용해서 가져온다. import _ from 'lodash' 1. 중복 제거 1-1 .중복내용 제거 .uniq() _.uniq([2,1,2]); 1-2 .중복 배열 내용 고유하게 만들기. _.uniqBy(중복 배열 데이터 ,고유 속성) const usersA = [ {userId : '1', name : 'HEROPY'}, {userId : '2', name : 'Neo'} ] const usersB = [ {userId : '1', name : 'HEROPY'}, {userId : '3', name : 'Amy'} ] //배열 합치기 const usersC = userA.concat(usersB); console.log(usersC); //결과 : {userId ..