minlog
[ 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. 콜백지옥 (연이은 콜백함수의 사용) 순차적으로 콜백함수를 사용할때 > 이와 같은 모양이 나타나게 된다. 다음 순서를 보장은 하지만 관리가 ..

[ 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 ] JSON 데이터 변형
카테고리 없음 2023. 8. 14. 18:21

JSON 파일 JSON 파일은 문자 데이터이다. { "name": "heropy", "age": 85 } 1. json을 활용한 데이터 타입 변형 1-1. 객체 => 문자 JSON.stringify(객체) = 문자 const user = { "name": "heropy", "age": 85 } const str = JSON.stringify(user); console.log(typeof str) //==> string 1-2. 문자 => 객체 JSON.parse(문자) = 객체 const obj = JSON.parse(str); console.log('obj',obj); ※ JSON 을 사용한 비동기통신 [ Spring ] JSON 객체 타입을 리턴하는 비동기식 처리방식 동기식 처리방식과 비동기식 처리방..

[ 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 ..

[ Javascript ] 가져오기 / 내보내기
FrontEnd/Javascript 2023. 8. 14. 17:35

모듈 가져오기 / 내보내기 가져오는 코드 없이 내보내는 코드로만 이루어진 파일을 모듈 이라고 한다. 1. 내보내기 파일 내에서 특정한 명령어를 내보낼 수 있다. default export = 이름을 지정하지 않고 내보내기 Named export = 이름을 지정하여 내보내기 1-1 . default export 기본적으로 하나의 함수만 내보낼 수 있다. 📑 getType.js export default function (data){ return Object.prototype.toString.call(data).slice(8,2); } 1-2 . Named export 개수의 지정 없이 여러 개를 내보낼 수 잇다. 이름을 지정해야하는 함수와 기본 내보내기 함수를 함께 사용 가능하다. 📑 getRandom.j..