Programming/JavaScript (15) 썸네일형 리스트형 [JavaScript] String to Boolean, Boolean to String (타입 변환하기) API를 통해 응답받은 데이터가 String 타입의 "true", "false"일 경우에, Boolean 타입의 변수로 받아 분기처리하기 위해서 사용한 방법이다. 반대로 Boolean 타입을 String 타입으로 변환하는 방법도 정리해보았다. String to Boolean (Boolean 타입으로 변환하기) JSON.parse(), $.parseJSON()을 이용하면 된다. JSON.parse("true");// true JSON.parse("false");// false // JQuery $.parseJSON("true");// true $.parseJSON("false");// false console.log(typeof(JSON.parse("true")));// "boolean" JQuery인 경.. [JavaScript] 배열, 객체, 배열 안에 객체, 객체 안에 배열 생성하기 배열 생성하기 var arr = [];// 빈 배열 생성 arr[0] = 'a'; arr[1] = 'b'; arr[2] = 'c'; var arr = ['a', 'b', 'c'];// 초기값 할당 배열 생성 객체 생성하기 var obj = {};// 빈 객체 생성 obj.a = "a"; obj.b = "b"; obj.c = "c"; var obj = {a : "a", b : "b", c : "c"};// 초기값 할당 객체 생성 배열 안에 객체 생성하기 var objArr = [ {a0:"a0", b0:"b0", c0:"c0", d0:"d0"}, {a1:"a1", b1:"b1", c1:"c1", d1:"d1"}, {a2:"a2", b2:"b2", c2:"c2", d2:"d2"} ] 객체 안에 배열 생성하기.. [JavaScript] 날짜 형식 수정하기 : moment.js 게시물 생성 날짜에 대한 형식을 바꿀 필요가 있었다. 받아온 데이터는 "2022-08-27T18:00:41Z"이였고, 나는 이것을 "2022.08.27"로 변환하고 싶었다. 그래서 알게 된 라이브러리가 moment.js! JavaScript 날짜 라이브러리이다. 날짜 형식 수정하기 1. 라이브러리 설치 2. 필요한 부분만 잘라내기 : .substr()을 이용하여 2022-08-27T18:00:41Z를 2022-08-27로 자름 3. 문자열로 변환하기 : .format()을 이용하여 moment 객체가 아닌 문자열로 변환 1. 라이브러리 설치 $ npm install moment --save or $ yarn add moment 2. 필요한 부분만 잘라내기 const created_at = moment((.. [JavaScript] 배열을 객체로 만들기 : map(), Object.fromEntries() 함수로 배열을 객체로 만들기 1. map() 함수 이용하기 2. Object.fromEntries() 함수 이용하기 1. map() 함수 이용하기 const arr = [[1,2], [3,4], [5,6]]; let formattedArr = arr.map(function(a) { let newArr = {}; newArr[a[0]] = a[1]; return newArr; }); // formattedArr => (3) [{1: 2}, {3: 4}, {5: 6}] 2. Object.fromEntries() 함수 이용하기 const arr = [ ['name', 'Chloe'], ['age', 17], ['city', 'NewYork'] ]; const newObj = Object.fromEntries(.. [JavaScript] map(), filter() 같이 사용하기 게시물을 출력하는 과정에서 불필요한 게시물은 제외해야했다. 내 경우에는 같은 유저의 게시물을 보여주면 안됐기 때문에, filter로 한번 걸러주고 나머지를 map으로 돌려서 뿌려주었다. 전체 코드를 살펴보자. 전체 코드 const Posts = () => { const [otherPosts, setOtherPosts] = useState([]) const getOtherPosts = async (producId) => { const res = await get(...); setOtherPosts(res.data.data...); }; useEffect(() => { getOtherPosts(); }, []); return ( {otherPosts.filter((post) => userId !== post.. [JavaScript] for문에서 setTimeout() 호출 시 var, let 차이 변수를 선언하는 var, let 키워드는 서로 다른 스코프를 가지고 있다는 점에서 차이가 있다. 이 때문에 같은 코드를 실행했더라도 다른 결과를 출력하는 모습을 볼 수 있다. 내가 의도한 것은 1초 후에 0, 1, 2, ... 9 가 출력되는 것이었다. 왜 의도한대로 되지 않는지, 변수에 무슨 차이가 있는지 정리해보았다. var 다음과 같이 코드를 짰을 때, 함수 스코프를 가지는 var 키워드의 경우에는 10을 10번 출력한다. for (var i = 0; i < 10; i++) { setTimeout(function() { console.log(i) }, 1000) } for문이 시작하고 하위 setTimeout 함수도 1초 후에 시작되는데, 이 때 for문은 무척 빠른 속도로 돌기 때문에 setTim.. [JavaScript] var, let, const 변수의 차이는? var, let, const 모두 변수를 선언하는 키워드이다. ES5 까지만 해도 var 변수를 사용했지만, ES6 이후로 let, const가 추가되었다. 그렇다면 차이점에는 어떤 것이 있을까? 간단하게 정리해보면, 아래 표와 같다. var let const 재선언 가능 불가능 재할당 가능 불가능 스코프 함수 스코프 블록 스코프 1. 변수에 재할당 var의 경우에는 변수 재선언과 재할당이 가능하고, let은 변수에 재할당이 가능한 반면 const는 불가능하기 때문에 immtuable하다고 할 수 있다. var number = 10 console.log(number) // 10 var number = 20// 재선언 console.log(number) // 20 number = 30// 재할당 conso.. [JavaScript] 함수 선언형과 함수 표현식의 차이점 막연히 사용하던 함수 선언식(Function Declaration)과 함수 표현식(Function Expression)에 대해 알아보고, 차이점을 소개하고자 한다! 호이스팅.. 정말 헷갈렸는데 정리가 좀 된 것 같다 ㅎㅎ 함수 선언형과 함수 표현식 함수 선언형 함수명이 정의되어 있고, 별도의 할당 명령이 없다. function sum(a,b) { return a + b; } 함수 표현식 정의한 함수를 별도의 변수에 할당한다. const sum = function(a,b) { return a + b; } 함수 선언식과 함수 표현식의 차이점 결과부터 말하면, 스코프와 호이스팅에서 차이가 있습니다. 1. Scope 함수 선언식 var와 같이 함수 스코프를 가진다. function func1() { functi.. 이전 1 2 다음 목록 더보기
