Javascript50 [JS] 특수문자를 거르는 정규식 표현 오늘 프로그래머스 코딩 테스트 연습문제를 풀면서 정규식을 사용해야 하는 문제가 있었다. 하... 정규식 너란 녀석... 어떻게 돌아서면 까먹는지... ㅋㅋㅋ 하지만 포기하지 말자. 언젠가는 외워지겠지... 일단 오늘 문제에서는 소문자 영어와 숫자 그리고 . - _ 이렇게 세 가지 문자를 제외한 모든 문자는 제외시켜야 하는 코드를 필요로 했다. 따라서 몇분간의 삽질 결과... 아래와 같은 정규식 표현을 만들었다. const allowedCharacters = /^[a-z0-9._-]/g; const notAllowedCharacters = /[^-_.a-z0-9]/g; const capitalLetters = /^[A-Z]/g 우선 [] 괄호 밖에 있는 ^ 이 문자의 뜻은 해당 괄호 안의 문자로 시작한다는.. 2022. 3. 15. [NodeJS] NodeJs는 싱글스레드일까? nodejs는 과연 싱글 스레드일까? 구글링을 하면 다소 모호한 답변들이 많이 올라와 있다. 싱글 스레드이지만 멀티스레드와 같이 동작한다... 뭐야 이게... 내가 산 주식 가격이 오를 수도 있지만 떨어질 수도 있다는 말이랑 똑같잖아... 오늘은 왜 이런 기이한 말이 나왔는지 알아보자. nodeJS 동작 원리 nodej의 v8엔진은 자바스크립트를 기계어로 번역하는 일을 하는데, 웹에서와 마찬가지로 스택에 이벤트를 쌓고 상단의 이벤트를 우선 처리해 반환하는 방식으로 작동한다. 우리가 싱글 스레드 언어라고 부르는 이유다. 하지만 한 번에 처리하기 어려운 작업이나 비동기 처리의 경우 v8엔진은 이벤트를 잠시 큐에 옮겨놓고 해당 요청이 처리되면 이벤트 루프가 다시 스택에 옮겨놓는 방식으로 동작하는데, 웹의 경우.. 2022. 3. 14. [NodeJS] 런타임이란 무엇일까? nodeJS란 무엇인가요?라고 물으면 항상 따라 나오는 답변이 있다. nodejs === javascript runtime environment 음... 그렇다면 런타임이란 무엇일까? 구글에는 아래와 같이 나와있다. What Does Runtime Environment (RTE) Mean? The runtime environment is the environment in which a program or application is executed. It's the hardware and software infrastructure that supports the running of a particular codebase in real time. 런타임 환경이란 무엇인가요? 런타임 환경이란 프로그램이나 어플.. 2022. 3. 14. [JS] Hoisting이란? 자바스크립트 엔진은 코드를 실행할 때 함수와 변수 선언을 코드 상단으로 끌어올리는 호이스팅 작업을 실행한다. 왜 그럴까? 호이스팅를 통해 개발자는 변수 선언과 변수사용을 자유롭게 활용 가능하다. 즉 항상 상단에 변수 선언과 할당을 하지 않더라도 같은 스코프라면 언제든지 변수를 사용할 수 있게 되는 것이다. 하지만 함수의 경우 선언식인지 표현식인지에 따라 약간의 차이가 발생한다. 예를 들어 선언식의 경우 아래와 같이 작동을 한다. foo(); // "foo" function foo() { console.log('foo'); } 하지만 만약 표현식의 경우 변수 선언만이 호이스팅으로 이루어지기 때문에 아래와 같은 결과를 가지게 된다. foo(); // Uncaught TypeError: foo is not a.. 2022. 3. 13. [JS] let, var, const의 차이점 오늘은 기술면접의 단골 질문이라 할 수 있는 const let var의 차이점과 호이스팅에 대해 알아보자. 자바스크립트에서 변수의 선언은 총 세가지 방법이 있는데, 위 짤에서 알 수 있듯... 우리 var 친구는 약간... 관심이 필요한 친구다... VAR ES6 이전에는 변수 선언과 할당을 위해서는 var키워드를 사용해야 했다. Scope of var 스코프란 간단하게 말해 변수들이 어디서 사용 가능한가를 나타낸다. var선언은 global 혹은 function/locally 스코프다. var변수가 만약 함수 밖에서 선언되었다면 var은 글로벌 스코프를 가진다. 그 말은 전 영역에서 사용 가능하다는 뜻. 만약 var변수가 함수안에서 선언된다면 함수 블록 안에서 접근 가능하다. Var variables .. 2022. 3. 13. [JS] 스크린 맨 아래 이동하기 웹 페이지에서 스크롤을 가장 하단으로 내리고 싶다면 어떻게 하면 될까? 코드는 아주 간단하다. window.scrollTo(0, document.body.scrollHeight); scrollTo 메서드는 첫번째 인자로는 x좌표 두 번째 인자로 y좌표를 받는다. document.body.scrollHeight 프로퍼티는 현재 창의 최대 높이값을 뜻한다. 만약 window.scrollTo(0,0)은 y좌표의 0 즉 최상단을 뜻하게 된다. 2022. 3. 5. [JS] 이메일 인증 코드 생성하기 이메일 인증이나 별도의 인증코드를 만들어 보내줘야 할 때 그냥 번호만 띡 하고 만들어서 보내면 뭔가 보안상 안 좋을 것 같기도 하고 제일 큰 문제는 멋있지가 않다... 그래서 이번에는 랜덤으로 코드를 생성해주는 crypto.randomBytes를 사용해 보았다. crypto.randomBytes( size, callback ) 사용방법과 설명은 GeeksforGeeks에서 자세히 잘 나와있다. // Node.js program to demonstrate the // crypto.randomBytes() method // Including crypto module const crypto = require('crypto'); // Calling randomBytes method with callback cr.. 2022. 2. 13. [NodeJs] nodeJS를 이용해 이메일 보내기 오늘은 nodeJS를 이용해 이메일을 보내는 방법을 알아보자. 사실 mailchimp와 같은 Third-party API를 활용하면 간단하게 메일을 작성해서 메일을 주고받을 수 있지만, Third-party API를 이용하면 해당 API를 또 한 번 학습해야 하는 데다 지원하는 기능 이외에 기능을 추가하기가 어려운 단점이 있다. 따라서 오늘은 SMTP 프로토콜을 이용한 이메일 전송방법을 알아보려한다. NodeJS에는 SMTP 프로토콜 통신을 위한 준비가 모두 되어있다. 일단은 아래 모듈을 다운받아 주자 npm install nodemailer createTransport() 메서드는 메일을 보내기 전 환경을 셋업 하는 메서드다. 필자는 naver를 이용했기 때문에 아래와 같이 설정했다. const nod.. 2022. 1. 30. [nodeJs] Yahoo Finance에서 주식 데이터 끌어오기 국내 커뮤니티를 돌아다니다 보면 주식 데이터를 활용한 프로그래밍에 대한 글은 많지만 막상 그 안을 들여다보면 거의 크롤링을 이용한 데이터 끌어오는 방식에 초점이 맞춰져 있다. 사실 그럴 수 밖에 없는 것이, 국내에 주식 데이터 api를 제공하는 기업이 사실상 전무하다 보니 이런 현상이 일어나는 듯하다. 인공지능과 빅데이터를 외치는 사람은 많지만 정작 프로그래밍에 필요한 데이터를 제공하는 곳은 없는 대한민국... 이전에는 한국거래소에서 실시간 정보를 api를 통해 제공한 듯 하지만 지금은 그마저도 서비스를 종료해 데이터를 받아올 수 없게 되어 버렸다. 그래서 방법이 없을까... 고민을 하던 중 Yahoo Finance에서 주식 데이터를 api로 받아 올 수 있음을 발견했다. 1. RapidApi 가입 ht.. 2022. 1. 29. [JS] 날짜 데이터 포맷 변경하기 코딩을 하면서 제일 껄끄러운 데이터 타입이 날짜 데이터다. 정확히 표현하자면 날짜 형식으로 된 데이터가 까다롭다. 어떤 날짜는 스트링으로 표현되기도 하며 어떤 날짜는 객체 형식을 띄기도 한다. 오늘 코딩을 하면서 날짜 데이터의 포멧을 바꿔야 하는 상황이 있어 관련해서 글을 남긴다. 간단하게 체크인 체크아웃 날짜를 선택할 수 있는 캘린더를 만들었다. 캘린더를 통해 날짜를 입력받으면 객체타입의 'US-us' 데이트 타입이 저장된다. ex: Jan 12 2012 10:25:26 문제는 데이터베이스의 경우 ISO format을 이용하기 때문에 이후 날짜를 이용한 기능 구현에 문제가 생길 것으로 생각되었다. ex: 2022-12-29 10:25:26 toISOString() 메소드 다행히도 javascript에는.. 2022. 1. 23. [JS] 화살표 함수에서의 "this" 자동 바인딩 React 관련 포스팅에서 화살표 함수에서 this는 자동으로 바인딩된다고 설명을 했었는데, 이것이 의미하는 것은 무엇인지 그리고 관련해서 좀 더 Deep 하게 들어가 보자. 이것과 관련해서 아래 블로그를 번역하여 옮겼으니 참조하시길 바란다. 출처: https://javascript.plainenglish.io/this-binding-in-es6-arrow-function-70d80e216238 How “this” binds in regular functions and arrow functions in JavaScript Arrow syntax automatically binds this to the surrounding code’s context…but what does this mean? javasc.. 2021. 12. 6. [JS] Event Bubbling and Event Capturing React를 공부하다가 event.stopPropagation() 메소드를 보았다. 도대체 event.stopPropagation() 메소드가 왜 필요한지 조사를 해보니... 자바스크립트가 이벤트를 실행 할 때 event 버블링 현상이 발생하기 때문에 event bubbling 현상을 막기 위해 해당 메소드가 필요하다고 한다. 그렇다면 이벤트 버블링이란 무엇이고 왜 발생하는 것일까? 아래 블로그에 관련된 내용이 자세히 설명되어 있어 번역해 옮겨본다. 출처: https://vsvaibhav2016.medium.com/event-bubbling-and-event-capturing-in-javascript-6ff38bec30e Event Bubbling and Event Capturing in JavaScri.. 2021. 12. 5. 이전 1 2 3 4 5 다음