프론트 산악회🌾 프론트 산악회🌾

분류 전체보기

• [JavaScript] 스코프(Scope)와 클로저(Closure)

  Front-End/JavaScript 2023. 4. 5. 04:07

  🍀 목차 글의 목적 스코프 스코프의 구분 스코프 이해 + LHS, RHS 어휘적 스코프(Lexical Scope) 함수 레벨 스코프 vs 블록 레벨 스코프 클로저 클로저 예제 글의 목적 자바스크립트를 학습하다 보면 스코프(Scope), 클로저(Closure)라는 단어를 빈번하게 마주칠 수 있었다. 그럴 때마다 검색해서 대략적인 감만 잡고 넘어갔었다. 😎 "클로저가 무엇인가요?"라는 질문을 받았을 때, 내가 과연 이해한 답변을 할지, 외운 답변을 할지 생각해 봤을 때 후자에 가깝다고 느꼈다. 그렇기에 이 글은 자바스크립트의 스코프와 클로저를 이해하기 위해 작성됐다. 스코프 스코프는 자바스크립트뿐만 아니라 여러 프로그래밍 언어의 기본 개념이다. 우선, 아래 코드의 실행 결과를 예측해 보자. var x = '..

• [프로그래머스] 표 병합(JavaScript)

  Problem-Solving/Problem 2023. 3. 6. 04:29

  🍀 목차 문제 설계 구현(JavaScript) 최종 코드 문제 https://school.programmers.co.kr/learn/courses/30/lessons/150366 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 설계 MERGE와 UNMERGE 명령어를 구현하는 데 많은 고민을 했다. 테스트에서는 위의 명령어를 Union-Find로 접근했었으나 구현과정에서 시간이 부족하여 해결하지 못했다. 다시 풀어보니 문제에서 주어진 표의 크기가 50X50으로 크지 않은 편이어서 완전 탐색과 구현으로 해결할 수 있었다. 문제 설명에서 주의 깊게 봐야 할 내..

• [JavaScript] 클린 코드 자바스크립트 강의 정리

  Front-End/JavaScript 2022. 12. 15. 00:04

  🍀 목차 JavaScript 클린 코드? 변수 다루기 : 전역 공간 사용 최소화 변수 다루기 : 임시 변수 제거하기 타입 다루기 : 타입 검사, 형변환 주의하기, isNaN 경계 다루기 : 매개변수의 순서가 경계다 분기 다루기 : 값식문 분기 다루기 : 삼항 연산자 다루기, Truthy & Falsy Udemy 클린코드 자바스크립트(강사 장 현석님(Poco Jang), https://www.udemy.com/course/clean-code-js/) 강의를 개인적으로 정리하다 복습 겸 깔끔하게 포스팅하고 싶었다. 나쁜 코드인 이유와 습관을 고쳐주시는 강의였다. 모든 강의 내용 정리가 아니기에 내용이 흥미로우시다면 수강 추천드립니다! 👍 JavaScript 클린 코드? 해당 강의는 클린 코드에 대해 고민하는..

• [JavaScript] 정규 표현식(Regular Expression) 정리

  Front-End/JavaScript 2022. 9. 21. 06:16

  🍀 목차 글의 목적 정규 표현식이 뭘까? in JavaScript 응용 모음 시간 복잡도 학습에 도움이 되는 사이트 글의 목적 정규 표현식을 이해하고 JavaScript에서의 다양한 사용법을 정리하기 위해 작성됐다. 정규 표현식을 사용하면 문자열에서 특정 패턴을 찾고, 매칭 되는 것들을 배열로 받는 등 문자열 처리를 매우 편하게 할 수 있다. 웹 사이트의 이메일, 패스워드의 유효성 검증에도 자주 사용된다. 알아두면 손해는 안 보는 정규 표현식! 정규 표현식 객체(RegExp)의 메서드와 String 메서드, 다양한 예제로 정규 표현식을 이해해보자. 🔥 정규 표현식이 뭘까? 정규 표현식(Regular Expression(RegExp, Regex), 정규식)은 문자열에서 특정 내용을 매칭 하는 데 사용된다...

• [프로그래머스] 등산코스 정하기(JavaScript)

  Problem-Solving/Problem 2022. 9. 7. 17:34

  🍀 목차 문제 설계 구현(JavaScript) 최종 코드 훔쳐보기 문제 https://school.programmers.co.kr/learn/courses/30/lessons/118669 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 설계 코딩 테스트에서 이 문제를 마주쳤을 때는 DFS로 접근했었는데, 테스트 케이스에서 틀리고 시간 복잡도도 엄청났던 코드였다. 몇 개월 뒤 다시 보니 시작 정점에서 목적 정점까지의 최소 거리를 구하는 다익스트라알고리즘으로 접근할 수 있는 문제라고 생각했다. 그러나 몇 시간 동안 헤맸지만 테스트 케이스 3개에서 계속 시간 초..

• [JavaScript] 이벤트 루프(Event loop) 정리

  Front-End/JavaScript 2022. 8. 25. 03:52

  🍀 목차 글의 목적 프로세스와 스레드? 자바스크립트의 런타임 환경 이벤트 루프 Task Queue Microtask Queue Render 큰 그림으로 이해 마치며 글의 목적 자바스크립트 언어 자체는 싱글 스레드(단일 스레드, Call Stack이 하나라 하나의 코드만 실행할 수 있음) 환경이다. 의문이 든다. 🤪 "setTimeout()도 그렇고, 여러 비동기, 콜백 함수의 작업은 어떻게 하고 있는 건데?!" 여기서 등장하는 개념이 이번 글에서 다룰 이벤트 루프이다. 자바스크립트의 메인 스레드는 이벤트 루프에 의해 관리된다. 또 글을 읽기 전, 미리 알아두면 좋을 개념은 자바스크립트의 런타임 환경은 멀티 스레드 환경처럼 동작한다는 것이다. 이 글은 자바스크립트 런타임 환경과 이벤트 루프의 개념을 큰 그..

• [그림으로 배우는 구조와 원리 운영체제] 1강 연습문제 풀이

  Computer-Science/OS 2022. 8. 13. 04:09

  Chapter 01 컴퓨터 시스템의 소개 01. 컴퓨터 내부에서 프로세서 메모리 사이의 정보 전송에 사용하는 통로는? ① 버스 ② 레지스터 ③ 블록 ④ 보조기억장치 시스템 버스는 하드웨어를 물리적으로 연결하여 서로 데이터를 주고받을 수 있게 하는 통로이다. 컴퓨터 내부의 다양한 신호(데이터 입출력, 프로세스 상태, 인터럽트 요구, 클록 등)를 시스템 버스로 전달한다. 레지스터는 프로세서 내부에 있으며, 프로세서가 사용할 데이터를 보관하는 가장 빠른 메모리이다. 블록은 메모리와 디스크 간 전송 단위이다. 보조기억장치는 주변장치 중 프로그램과 데이터를 저장하는 하드웨어. 02. 프로세서에서 사용하는 버스 형태가 아닌 것은? ① 주소 버스 ② 제어 버스 ③ 데이터 버스 ④ 시스템 버스 프로세서에서 사용하는 데..

• [자바스크립트 완벽 가이드] 3장 - 타입, 값, 변수

  Reading/Tech 2022. 8. 11. 22:43

  🍀 목차 3.1 개요와 정의 3.2 숫자 3.3 텍스트 3.4 불 값 3.5 null과 undefined 3.6 심벌 3.7 전역 객체 3.8 불변인 기본 값과 가변인 객체 참조 3.9 타입 변환 3.10 변수 선언과 할당 3.1 개요와 정의 기본 타입(불변) : 숫자, 문자열, 불(boolean), null, undefined, 심벌(Symbol) 객체 타입(가변) : 기본 객체, 배열, Set 객체, Map 객체, RegExp 타입, Date 타입, 함수와 클래스 등. 자바스크립트 인터프리터는 자동으로 가비지 컬렉션을 수행해 메모리를 관리한다. 일반적으로 객체나 다른 값을 직접 파괴하거나 할당을 해제해줄 필요는 없다. 프로그램에서 어떤 값을 더 이상 참조하지 않으면 인터프리터는 그 값을 다시 사용하지..