본문 바로가기

JS8

[React] .js vs .jsx React 또는 React Native 프로젝트를 할 때 .js 확장자를 사용하는 경우도 있고 .jsx 확장자를 사용하는 경우도 있었습니다. 구현하는 방식에서 두 가지 방식에 크게 차이는 없다고 느꼈는데 과연 정말 차이가 없을까에 대한 의문점이 생겨서 이 포스트를 작성해보게 되었습니다. js vs jsx란 키워드를 구글링해보면 가장 먼저 나오는 게시물이 이 스택오버플로우 게시물입니다. https://stackoverflow.com/questions/46169472/reactjs-js-vs-jsx ReactJS - .JS vs .JSX There is something I find very confusing when working in React.js. There are plenty of examples .. 2021. 12. 27.
[JavaScript] 불변성 JavaScript의 자료형은 크게 원시형과 객체형으로 나눌 수 있습니다. 원시형 자료형은 아래와 같습니다. 숫자형(number) BigInt 문자형(string) 불린형(boolean) Symbol null undefined 원시형 자료형의 특징은 불변하다는 것입니다. let a = 1; let b = a; 위와 같은 예시를 봅시다. 원시형 자료형의 경우 값을 할당할 떄 메모리 주소값을 이용해 값을 할당합니다. let b=a라는 문장을 통해 b 변수에 a 값을 할당할 때 역시 a의 값을 할당하는 것이 아닌 a의 주소값을 할당하는 것입니다. 원시형 자료형은 값을 할당할 떄마다 새로운 주소값을 할당하는 형식으로 동작하기 때문에 불변한 것이라 얘기할 수 있습니다. 아래 객체형 자료형을 이용한 예시문을 살펴보.. 2021. 8. 18.
[JavaScript] JavaScript 배열 숫자 정렬 const arr = [1, 101, 10001, 222]; console.log(arr); // [ 1, 101, 10001, 222 ] arr.sort(); console.log(arr); // [ 1, 101, 10001, 222 ] 위 코드는 자바스크립트에서 배열을 정렬하는 코드입니다. 숫자를 정렬하려고 했는데 javascript 내장 메서드인 sort 함수를 사용하니 이상한 결과가 나옵니다. 왜 그럴까요 JavaScript에서 sort 함수를 실행했을 때 배열을 문자열을 기준으로 정렬해주기 때문입니다. 따라서 js에서 숫자를 기준으로 배열을 정렬해주고 싶다면 아래와 같이 코드를 수정해주어야 합니다. const arr = [1, 101, 10001, 222]; console.log(arr); //.. 2021. 8. 2.
[JavaScript] 위크맵(WeakMap)과 위크셋(WeakSet) 1. WeakMap WeakMap과 Map은 비슷한 자료구조입니다. 다만 한 가지 명확한 차이점이 있다면, 위크맵은 키로 반드시 객체를 받아와야 합니다. 아래 예제 코드를 통해 WeakMap에 대해 살펴봅시다. let weakMap = new WeakMap(); //weakMap 선언 let object={name:'Jason'}; weakMap.set(object, 'hi!'); weakMap.set('string', 'hi!'); // error! WeakMap에서 지원하는 메서드는 Map 객체의 메서드와 비슷한 양상을 띱니다. Map 객체 메서드는 아래 포스팅에서 확인하실 수 있습니다. https://eloquence-developers.tistory.com/167 [JavaScript] 맵(Map.. 2021. 7. 30.