프로그래밍 73

[JavaScript] 자바스크립트의 원시값과 복합객체 이해하기

자바스크립트는 다양한 데이터 타입을 제공하여, 개발자가 효율적으로 프로그래밍할 수 있는 환경을 만들어 줍니다. 이 포스트에서는 자바스크립트의 두 주요 데이터 타입인 원시값과 복합객체에 대해 깊이 있게 탐구해보겠습니다. 이해의 편의를 위해 정의에서 시작하여, 저장 및 복사 방법, 그리고 이들의 비교 방식에 대해 자세히 설명하겠습니다. 원시값(Primitive Values) 원시값은 변경 불가능한 가장 기본적인 데이터 타입을 말합니다. 자바스크립트에서는 null, undefined, 문자열(string), 숫자(number), 불리언(boolean), Symbol, BigInt를 원시값으로 분류합니다. 이들의 특징은 다음과 같습니다: 저장 및 복사: 원시값은 변수에 할당될 때 메모리에 그 값 자체가 저장됩니..

[JavaScrpit] Iterator pattern

1. Iterator pattern(이터레이터 패턴) ES6에서 도입된 이터레이션 프로토콜(iteration protocol)은 데이터 컬렉션을 순회하기 위한 프로토콜(미리 약속된 규칙)이다. 이터레이션 프로토콜을 준수한 객체는 for…of 문으로 순회할 수 있고 Spread 문법의 피연산자가 될 수 있다. 이터레이션 프로토콜에는 이터러블 프로토콜(iterable protocol)과 이터레이터 프로토콜(iterator protocol)이 있다. 이터레이터 패턴은 이터레이터를 사용하여 컬렉션의 요소들에 접근하는 디자인 패턴이다. 여러 가지 자료형의 구조와는 상관없이 이터레이터라는 하나의 인터페이스로 순회가 가능하다는 장점이 있다. const mp = new Map(); mp.set('b', 2) mp.se..

Python 리스트(list)와 튜플(tuple) 개념 정리

파이썬은 데이터를 저장하고 처리하는 데 필요한 다양한 내장 데이터 타입을 제공합니다. 그 중에서도 리스트(List)와 튜플(Tuple)은 자주 사용되는 타입으로, 데이터의 순서와 집합을 다루는 데 매우 유용합니다. 이 두 타입의 가장 큰 차이점은 '변경 가능성(mutable vs immutable)'입니다. 1. 리스트(List) - 유연하고 동적인 컨테이너 - 리스트는 '변경 가능한(mutable)' 데이터 타입으로, 순서가 있는 요소의 집합입니다. 리스트는 대괄호 [] 또는 list() 함수를 통해 생성할 수 있으며, 다양한 데이터 타입을 포함할 수 있습니다. # 빈 리스트 생성 list1 = [] # 숫자로 구성된 리스트 list2 = [1, 2, 3, 4, 5] # 중첩 리스트 list3 = [1..

(JavaScript) eval()를 사용하면 안되는 이유

1. eval()? eval()는 문자열 수식 또는 문자열로 된 코드를 Javascript로 실행하는 메서드이다. 따라서 매개변수를 string 형식으로 받는다. 자바스크립트 표현식, 명령문, 또는 연속되는 다수의 명령문을 나타내는 문자열. 표현식은 이미 존재하는 객체의 변수나 속성을 포함할 수 있다. 매개변수로 받은 코드를 평가하여 얻은 값을 반환하고, 값이 없다면 undefined를 반환한다. 예시) var x = 10; var y = 20; var result = eval("x * y"); // 결과: 200 console.log(result); var jsonStr = '{"name": "John", "age": 30}'; var obj = eval("(" + jsonStr + ")"); cons..

[aws] React, Node.js 프로젝트 aws EC2에 배포하기 (Nginx 사용)

React, Node.js, MongoDB로 만든 프로젝트를 포트폴리오용으로 제출하고 싶어서 베포를 해보았다. 배포하는 방법에는 여러 가지가 있지만 나는 포트폴리오용이었기 때문에 무료로 사용할 수 있으면서 대중적으로 가장 많이 사용하는 aws에 배포를 해보기로 하였다. 1. aws 회원가입을 하고 EC2 인스턴스를 생성한다. EC2는 aws에서 제공하는 클라우드 컴퓨팅 서비스이다. 즉, 내가 만든 프로젝트를 항상 가동하고있는 클라우드 컴퓨터에서 실행하고 사람들이 볼 수 있도록 해준다. EC2의 장점은 인스턴스를 생성하여 운영체제, 소프트웨어 등을 자유롭게 선택할 수 있고, 메모리, CPU, 스토리지, 부팅 파티션 크기 등을 선택할 수 있다는 점이다. 1) 서울의 가상컴퓨팅을 사용하기 위하여 헤더 부분의 ..

프로그래밍/AWS 2023.04.20

[Node.js, TypeScript] ES Moudles 사용 시 import 문 확장자 제거하여 사용 하는 방법

- Ndoe.js는 기본적을 Common.js를 사용하여 문서를 불러올 때 require("")를 사용해야 하지만 ES Moudle로 전환하면 개발자들에게 익숙한 import를 사용할 수 있다. - 하지만, Esmoudle을 사용할 때, 모듈 내부에 있는 파일을 import 하고 싶다면 확장자를 mjs 붙여주거나 package.json에서 type:moudle을 입력해 주고 확장자에 js를 붙여줘야 한다. - 이런 번거로움을 해결하기 위한 방법을 포스팅한다. 1. node-modules는 컴파일하지 않을 것이기 때문에 제외를 해준다. //tsconfig.json { "compilerOptions": { "target": "esnext", "module": "esnext", "outDir": "./dist..

[React] web3.js React-Create-App 사용시 sourcemap 오류

React-Create-App로 프로젝트를 만들고 web3.js 라이브러리를 사용하려고 하는 도중 npm start 시 sourcemap 오류가 발생했다. failed to parse source map: 'webpack:///../../src.ts/coders/abstract-coder.ts' url is not supported 소스 맵(Source Map)이란 배포용으로 빌드한 파일과 원본 파일을 서로 연결시켜 주는 기능을 한다. 배포를 할 때 성능 최적화를 위해 HTML, CSS, JS와 같은 웹 자원들을 압축한다. 이때 배포한 파일에서 에러가 난다면 Sorce Map을 통해 원본과 비교하며 디버깅을 할 수 있는 유용한 기능이다. 하지만 소스맵을 사용하는데 단점이 있다. 1. 소스맵을 사용하면 개..

[truffle] Error: VM Exception while processing transaction: revert -- Reason given: Panic: Arithmetic overflow.

Dapp 개발을 위한 테스트를 하는 도 중 다음과 같은 오류가 발생하였다. 구글링 해보니 산술연산을 한 결괏값이 타입의 허용 범위를 넘어서 overflow 됐다고 알려주는 것 같았다. Solidity에서 고정 크기 정수에 대한 산술 연산은 연산 결과가 데이터 유형으로 나타낼 수 있는 최댓값 또는 최솟값을 초과할 경우 Overflow 또는 Underflow 오류가 발생할 수 있는데. Overflow는 최댓값을 초과한 경우, Underflow는 최솟값을 초과할 경우 나타난다. 그래서 컨트랙트 함수내의 산술연산하는 부분을 살펴보았고 다음과 같이 오입력 된 연산을 발견할 수 있었다. mapping(address => mapping(address => uint256)) public allowance; functi..

[truffle] truffle migration 오류(TypeError: Cannot read properties of undefined (reading 'call') at lastCompletedMigration)

Dapp을 만들기 위한 학습을 하던 중 truffle migration을 사용하려고 하자 오류가 발생하였다. 1. Node.js 버전 변경 시도 처음엔 관련 오류가 난 곳의 문서들이 node_modules와 관련되어 있어서, node의 버전이 문제인가 싶어서 stack-over flow의 글을 참고하여 node의 버전을 최신 LTS버전으로 바꾸어주었다. https://stackoverflow.com/questions/71081725/this-version-of-%C2%B5ws-is-not-compatible-with-your-node-js-bu ild-error-node-loade This version of µWS is not compatible with your Node.js build: Error:..

[TypeScript && React ] 리펙토링(1) - TodoList

프론트엔드 온보딩에 참여하게 되었는데, 사전과제로 TodoList 만들기를 했었다. 공고를 늦게 발견하여 시간에 쫓겨 황급히 만들었는데.. 그러다 보니 더럽고 난잡하게 만들어지고 필요 구현 사항들도 완전히 만들지 못하게 되었다. 그렇게 완전하지 못한 사전과제를 기반으로 수업을 들었는데... 멘토님의 지적사항 하나하나가 뜨끔하게 만들었고 코드를 잘 짜는 방법을 배울 수 있게 되어서 좋았다. 아직 실무 경험이 없어 몰랐던 것들을 배울 수 있을 것으로 기대된다. 나는 내용과 적용하는 게 어렵게 느껴졌지만 시간이 오래 걸리더라도 꼭 Todolist를 Best Practice로 만들기 위해 차근차근 리펙토링 해볼 예정이다. 1. Token과 Authorication의 상수 선언 - 회원가입을 통해 발급 받을 수 ..