전체 글
-
*우테코 딥 다이브 스터디 준비 중 작성한 정리본으로 필자의 잘못 이해한 부분이나 부족한 부분이 있을 수 있습니다. 동기 처리와 비동기 처리 일반적인 함수 호출 ⇒ 함수 호출 → 함수 코드 평가 → 함수 실행 컨텍스트 생성 → 실행 컨텍스트 스택 (콜 스택) 에 푸시 → 함수 코드 실행 → 종료 시 콜 스택에서 팝 돼서 제거됨 함수가 실행되려면 함수 코드 평가에서 생성된 함수 실행 컨텍스트가 실행 컨텐스트 스택에 푸시 → 함수의 실행 순서는 실행 컨텍스트 스택으로 관리함 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. (싱글 스레드 방식) : 동시에 2개 이상의 함수를 실행할 수 없다는 것을 의미함. == 한 번에 하나의 태스크만 실행할 수 있음 그래서 작업이 오래 걸리는 태스크를 실행하게 ..
[딥 다이브 스터디] 42장 비동기 프로그래밍*우테코 딥 다이브 스터디 준비 중 작성한 정리본으로 필자의 잘못 이해한 부분이나 부족한 부분이 있을 수 있습니다. 동기 처리와 비동기 처리 일반적인 함수 호출 ⇒ 함수 호출 → 함수 코드 평가 → 함수 실행 컨텍스트 생성 → 실행 컨텍스트 스택 (콜 스택) 에 푸시 → 함수 코드 실행 → 종료 시 콜 스택에서 팝 돼서 제거됨 함수가 실행되려면 함수 코드 평가에서 생성된 함수 실행 컨텍스트가 실행 컨텐스트 스택에 푸시 → 함수의 실행 순서는 실행 컨텍스트 스택으로 관리함 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. (싱글 스레드 방식) : 동시에 2개 이상의 함수를 실행할 수 없다는 것을 의미함. == 한 번에 하나의 태스크만 실행할 수 있음 그래서 작업이 오래 걸리는 태스크를 실행하게 ..
2024.04.03 -
*우테코 딥 다이브 스터디 준비 중 작성한 정리본으로 필자의 잘못 이해한 부분이나 부족한 부분이 있을 수 있습니다. Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. const person = new Object(); 생성자 함수 (constructor)란 new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다. 생성자 함수에 의해 생성된 객체를 인스턴스라고 한다. const strObj = new String('Lee'); // String 생성자 함수에 의해 String 객체 생성 생성자 함수에 의한 객체 생성 방식의 장점 객체 리터럴에 의한 객체 생성 방식의 문제점 동일한 프로퍼티를 갖는 객체를 여러개 생성하려면 매번 같..
[딥 다이브 스터디] 17장 생성자 함수에 의한 객체 생성*우테코 딥 다이브 스터디 준비 중 작성한 정리본으로 필자의 잘못 이해한 부분이나 부족한 부분이 있을 수 있습니다. Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. const person = new Object(); 생성자 함수 (constructor)란 new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다. 생성자 함수에 의해 생성된 객체를 인스턴스라고 한다. const strObj = new String('Lee'); // String 생성자 함수에 의해 String 객체 생성 생성자 함수에 의한 객체 생성 방식의 장점 객체 리터럴에 의한 객체 생성 방식의 문제점 동일한 프로퍼티를 갖는 객체를 여러개 생성하려면 매번 같..
2024.04.01 -
*우테코 딥 다이브 스터디 준비 중 작성한 정리본으로 필자의 잘못 이해한 부분이나 틀린 부분이 있을 수 있습니다. 프로퍼티란? 자바스크립트에서 "프로퍼티(Property)"는 객체(object)의 특징이나 상태를 나타내는 값(value)을 가리키는 이름-값 쌍(name-value pair)을 의미합니다. 이러한 프로퍼티들은 객체의 특정한 기능을 정의하거나 객체의 상태를 나타내는 데 사용됩니다. 프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트(속성)를 기본 값으로 자동 정의합니다. → 프로퍼티의 상태 프로퍼티의 값 (value) 값의 갱신 가능 여부 (writable) → false 시 값 변경 X 열거 가능 여부 (en..
[딥 다이브 스터디] 16장 프로퍼티 어트리뷰트*우테코 딥 다이브 스터디 준비 중 작성한 정리본으로 필자의 잘못 이해한 부분이나 틀린 부분이 있을 수 있습니다. 프로퍼티란? 자바스크립트에서 "프로퍼티(Property)"는 객체(object)의 특징이나 상태를 나타내는 값(value)을 가리키는 이름-값 쌍(name-value pair)을 의미합니다. 이러한 프로퍼티들은 객체의 특정한 기능을 정의하거나 객체의 상태를 나타내는 데 사용됩니다. 프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트(속성)를 기본 값으로 자동 정의합니다. → 프로퍼티의 상태 프로퍼티의 값 (value) 값의 갱신 가능 여부 (writable) → false 시 값 변경 X 열거 가능 여부 (en..
2024.04.01 -
점심 뭐 먹지 회고 시작 ! step1 부터 웹을 시작한 건 이 미션이 처음이라 재미있었던 거 같았다. 이제 진짜 프론트엔드 개발을 하는 느낌이랄까.. 사실 바닐라 JS 로 웹을 하는 건 쉬운 일이 아니었다. 하면 할수록 리액트가 천사 같이 보인달까.. 아무튼 이번 미션을 어떻게 진행했는지 작성해 보도록 하겠다. ✅ 베포 사이트 점심 뭐 먹지? 📍 기능 목표 : 캠퍼스 주변의 점심 식사 스팟 목록을 관리하는 앱을 만든다. 📍 학습 목표: 애플리케이션을 컴포넌트 단위로 모듈화 하여 개발 UI를 컴포넌트 단위로 생각하고 개발하며 재사용할 수 있는 컴포넌트를 고민해 보기 TypeScript의 기본 문법을 익히며 필요성을 경험 웹 UI 환경에서의 테스트 기초 사용자 관점에서 중요하다고 생각하는 기능을 스스로 정..
[우테코 6기] 레벨 1 5주차 - 점심 뭐 먹지 미션 회고 ❗️점심 뭐 먹지 회고 시작 ! step1 부터 웹을 시작한 건 이 미션이 처음이라 재미있었던 거 같았다. 이제 진짜 프론트엔드 개발을 하는 느낌이랄까.. 사실 바닐라 JS 로 웹을 하는 건 쉬운 일이 아니었다. 하면 할수록 리액트가 천사 같이 보인달까.. 아무튼 이번 미션을 어떻게 진행했는지 작성해 보도록 하겠다. ✅ 베포 사이트 점심 뭐 먹지? 📍 기능 목표 : 캠퍼스 주변의 점심 식사 스팟 목록을 관리하는 앱을 만든다. 📍 학습 목표: 애플리케이션을 컴포넌트 단위로 모듈화 하여 개발 UI를 컴포넌트 단위로 생각하고 개발하며 재사용할 수 있는 컴포넌트를 고민해 보기 TypeScript의 기본 문법을 익히며 필요성을 경험 웹 UI 환경에서의 테스트 기초 사용자 관점에서 중요하다고 생각하는 기능을 스스로 정..
2024.03.20 -
package.json 속 dependencies와 devDependencies의 차이가 뭘까? 리액트를 하다보면 npm i 를 통해 많은 라이브러리를 설치하면서 dependencies 가 늘어나는 걸 본 적이 있을 것이다. 나도 처음엔 두 차이에 대해서 잘 알지도 못했고 사실 궁금하지도 않았던거 같다. 그저 패키지를 설치하게 되면 어떤 패키지가 설치되었는지 확인하는 용도로만 사용했던거 같다. 그러다가 우테코 3번째 미션을 진행하면서 이러한 코멘트가 달렸다. 헉! 그리고 그제서야 부랴부랴 이 차이에 대해서 찾아보았던거 같다. dependencies 는 프로덕션 환경에서 필요한 패키지를 말하여 어플리케이션이 실행될 때 필요한 패키지들을 정의하는 것이었다. 리액트 같은 프레임워크를 사용하여 라이브러리를 설치..
[JavaScript] dependencies와 devDependencies의 차이 정리package.json 속 dependencies와 devDependencies의 차이가 뭘까? 리액트를 하다보면 npm i 를 통해 많은 라이브러리를 설치하면서 dependencies 가 늘어나는 걸 본 적이 있을 것이다. 나도 처음엔 두 차이에 대해서 잘 알지도 못했고 사실 궁금하지도 않았던거 같다. 그저 패키지를 설치하게 되면 어떤 패키지가 설치되었는지 확인하는 용도로만 사용했던거 같다. 그러다가 우테코 3번째 미션을 진행하면서 이러한 코멘트가 달렸다. 헉! 그리고 그제서야 부랴부랴 이 차이에 대해서 찾아보았던거 같다. dependencies 는 프로덕션 환경에서 필요한 패키지를 말하여 어플리케이션이 실행될 때 필요한 패키지들을 정의하는 것이었다. 리액트 같은 프레임워크를 사용하여 라이브러리를 설치..
2024.03.18 -
우테코 한 달 생활기라고 쓰고 사실 3,4주 차 회고록이다. 지난 1,2주차 회고가 보고 싶다면 여기로.. 사실 나의 회고록에는 거창한 것이 없다. 회고록을 작성하기 위해 다른 사람들을 어떻게 글을 쓰셨나 둘러보았다. 회고록을 쓸 때에도 잘 쓰고 싶다는 마음 때문일까? 난 아직도 성과주의 마인드셋에 머물러 있는 거 같다... 3주차를 시작하면서 이번 3주차에서는 지난 2주차에 TDD를 배우면서 진행했던 콘솔 기반 로또를 웹으로 바꾸는 미션이었다. 처음에 콘솔 할 때는 익숙하지 않다고 웹 하고 싶다고 소리쳤는데 막상 웹을 바닐라 Js로 하려니깐 익숙해진 콘솔이 그리웠다. 난 그래도 내가 웹을 꽤 해봤다고 생각했는데 오산이었다. 초반에 갈피 잡기가 어려웠다. 2차 미션을 그래도 어찌어찌 해결해서 피드백을 받..
[우테코 6기] 우아한테크코스 레벨 1 한달 생활기 ✏️우테코 한 달 생활기라고 쓰고 사실 3,4주 차 회고록이다. 지난 1,2주차 회고가 보고 싶다면 여기로.. 사실 나의 회고록에는 거창한 것이 없다. 회고록을 작성하기 위해 다른 사람들을 어떻게 글을 쓰셨나 둘러보았다. 회고록을 쓸 때에도 잘 쓰고 싶다는 마음 때문일까? 난 아직도 성과주의 마인드셋에 머물러 있는 거 같다... 3주차를 시작하면서 이번 3주차에서는 지난 2주차에 TDD를 배우면서 진행했던 콘솔 기반 로또를 웹으로 바꾸는 미션이었다. 처음에 콘솔 할 때는 익숙하지 않다고 웹 하고 싶다고 소리쳤는데 막상 웹을 바닐라 Js로 하려니깐 익숙해진 콘솔이 그리웠다. 난 그래도 내가 웹을 꽤 해봤다고 생각했는데 오산이었다. 초반에 갈피 잡기가 어려웠다. 2차 미션을 그래도 어찌어찌 해결해서 피드백을 받..
2024.03.11 -
이번 우테코 웹 기반 미션 로또를 진행하면서 HTML 내의 텍스트를 다루어야 하는 일이 있었습니다. 미션을 진행하면서 어떤 텍스트 요소를 사용하는 것이 좋은 코드일까 고민하면서 공부한 개념들을 살짝 정리해 보았습니다. 웹 개발에서 JavaScript를 활용하여 HTML 요소의 텍스트를 다루는 것은 아주 흔한 일입니다. 이를 다루기 위해서는 innerHTML, innerText, textContent 등의 다양한 속성들을 사용하여 다룰 수 있고, 각각 다른 특성을 가지고 있어 이를 이해하고 사용해야 합니다. 1. innerHTML innerHTML은 HTML 요소의 속성으로, 해당 요소 내에 포함된 HTML 또는 XML 마크업을 가져오거나 새 내용으로 설정할 수 있는 기능을 제공합니다. 이를 통해 쉽게 내..
[JavaScript] innerHTML, innerText, textContent 차이 정리이번 우테코 웹 기반 미션 로또를 진행하면서 HTML 내의 텍스트를 다루어야 하는 일이 있었습니다. 미션을 진행하면서 어떤 텍스트 요소를 사용하는 것이 좋은 코드일까 고민하면서 공부한 개념들을 살짝 정리해 보았습니다. 웹 개발에서 JavaScript를 활용하여 HTML 요소의 텍스트를 다루는 것은 아주 흔한 일입니다. 이를 다루기 위해서는 innerHTML, innerText, textContent 등의 다양한 속성들을 사용하여 다룰 수 있고, 각각 다른 특성을 가지고 있어 이를 이해하고 사용해야 합니다. 1. innerHTML innerHTML은 HTML 요소의 속성으로, 해당 요소 내에 포함된 HTML 또는 XML 마크업을 가져오거나 새 내용으로 설정할 수 있는 기능을 제공합니다. 이를 통해 쉽게 내..
2024.03.04 -
문제 나코더 기장 재민이는 동아리 회식을 준비하기 위해서 장부를 관리하는 중이다. 재현이는 재민이를 도와서 돈을 관리하는 중인데, 애석하게도 항상 정신없는 재현이는 돈을 실수로 잘못 부르는 사고를 치기 일쑤였다. 재현이는 잘못된 수를 부를 때마다 0을 외쳐서, 가장 최근에 재민이가 쓴 수를 지우게 시킨다. 재민이는 이렇게 모든 수를 받아 적은 후 그 수의 합을 알고 싶어 한다. 재민이를 도와주자! 입력 첫 번째 줄에 정수 K가 주어진다. (1 ≤ K ≤ 100,000) 이후 K개의 줄에 정수가 1개씩 주어진다. 정수는 0에서 1,000,000 사이의 값을 가지며, 정수가 "0" 일 경우에는 가장 최근에 쓴 수를 지우고, 아닐 경우 해당 수를 쓴다. 정수가 "0"일 경우에 지울 수 있는 수가 있음을 보장할..
[BOJ/백준] 10773번 제로 (c++)문제 나코더 기장 재민이는 동아리 회식을 준비하기 위해서 장부를 관리하는 중이다. 재현이는 재민이를 도와서 돈을 관리하는 중인데, 애석하게도 항상 정신없는 재현이는 돈을 실수로 잘못 부르는 사고를 치기 일쑤였다. 재현이는 잘못된 수를 부를 때마다 0을 외쳐서, 가장 최근에 재민이가 쓴 수를 지우게 시킨다. 재민이는 이렇게 모든 수를 받아 적은 후 그 수의 합을 알고 싶어 한다. 재민이를 도와주자! 입력 첫 번째 줄에 정수 K가 주어진다. (1 ≤ K ≤ 100,000) 이후 K개의 줄에 정수가 1개씩 주어진다. 정수는 0에서 1,000,000 사이의 값을 가지며, 정수가 "0" 일 경우에는 가장 최근에 쓴 수를 지우고, 아닐 경우 해당 수를 쓴다. 정수가 "0"일 경우에 지울 수 있는 수가 있음을 보장할..
2024.03.01