배워서 남주는 개발자 :)
반응형

자바스크립트 12

[ JS 딥다이브 ] 10주차 : 스코프

1. 스코프란? 스코프는 식별자가 유효한 범위를 말한다. 변수는 자신이 선언된 위치에 따라서 자신이 유효한 범위, 즉 다른 코드가 변수 자신을 참조할 수 있는 범위가 결정된다. let a = 'jason' function name() { let a = 'tom' console.log(a); // 1️⃣ } name() console.log(a); // 2️⃣ 위에서 코드의 가장 바깥 부분과 name 함수 내부에서 동일한 변수 a를 선언하고 1️⃣과 2️⃣에서 a 변수를 참조한다. 이때 JS엔진은 이름이 같은 두개의 변수 중에서 어떤 변수를 참조할지 결정한다. 이를 식별자 결정이라고 한다. JS엔진은 스코프를 통해 어떤 변수를 참조해야 할지 결정한다. 따라서 스코프란 JS엔진이 식별자를 검색할 때 사용하는..

JS 2023.04.22

[ JS 딥다이브 ] 9주차 : 함수

1. 함수란? 함수는 JS에서 가장 중요한 핵심개념이다. 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것이다. // f(x,y) = x + y function sum(a, b){ return a + b } f(3, 9) = 12 sum(3,9) // 12 * 매개변수 - 함수 내부로 입력을 전달받는 변수 * 입력 - 인수 / 출력 - 반환값 함수는 정의를 통해 생성이 가능하다. 또한 인수를 매개변수로 통해 함수에 전달하면서 함수의 실행을 명시적으로 지시하는 함수의 호출을 해야 코드 블록에 담긴 문들이 실행된다. 2. 사용이유 함수는 필요할 때 여러번 호출할 수 있다. ➡️ 코드의 재사용 측면에서 매우 유용하다. 함수의 이름은 자신의 역할을 잘 설명하도록 작성되어야 한다...

JS 2023.03.25

[JS 핵심개념] 1주차 : 변수 란 무엇일까? Variable

본 내용은 모던 자바스크립트 딥다이브 책을 읽고 공부목적으로 정리한 내용입니다. 1) 변수란 무엇인가? 변수 : 변하는 수? 라고만 생각했다. 변수 : 프로그래밍 언어에서 데이터를 관리 하기 위한 핵심 개념 컴퓨터는 CPU를 사용해 연산을 하고, 메모리를 사용해 데이터를 기억함. 메모리는 데이터를 저장할 수 있는 메모리셀의 집합체. 메모리 셀 하나의 크기는 1바이트 (8비트)이며, 컴퓨터는 메모리 셀의 크기, 즉 1바이트 단위로 데이터를 저장하거나 읽음. 각 셀은 고유의 메모리 주소를 갖는다. 이 메모리 주소는 메모리 공간의 위치를 나타내며, 0 부터 시작해서 메모리의 크기만큼 정수로 표현됨. 컴퓨터는 모든 데이터를 2진수로 처리함. 따라서 메모리에 저장되는 데이터는 데이터의 종류와 상관없이 모두 2진수..

JS 2023.01.10

이벤트 루프란? [ 자바스크립트 동작원리 ]

(이번 포스팅은 아래의 이벤트 루프 영상을 보고 정리한 포스팅입니다.) https://youtu.be/8aGhZQkoFbQ 자세한 설명을 원하시는 분은 위의 영상을 참고해주세요! :) 자바스크립트는 기본적으로 싱글스레드 프로그래밍 언어이다. 여기서 싱글스레드라는 것은 한 번에 하나의 작업만이 가능하다는 의미이다. one thread == one call stack == one thing at a time 여기서 호출 스택(call stack)이라는 것은 프로그램 상에서 우리가 어떤 순서로 작업을 수행하는지 기록하는 작업 스케줄링과 관련된 자료구조이다. 우리가 어떤 함수를 실행하게 되면 우리는 그 함수를 stack(스택)의 맨 위에 놓는데, 이것을 push라고 한다. 만약에 함수가 어떤 값을 리턴하거나 실..

Web 2022.04.22

실행 컨텍스트 (Execution Context) 란? 자바스크립트 동작원리

(해당 포스팅은 개인 공부를 목적으로 작성된 포스팅으로 부족한 점이 있더라도 양해 부탁드립니다!) 1. 실행 컨텍스트 2. 실행 컨텍스트의 3가지 객체 2-1. Variable Object (VO) 2-2. Scope Chain (SC) 2-3. this Value 3. 실행 컨텍스트의 생성 과정 3-1. 전역 코드에 진입 3-2. 전역 코드의 실행 3-3. foo()함수의 실행 1. 실행 컨텍스트 ECMA Script 스펙에 따르면 실행 컨텍스트를 '실행가능한 코드를 형상화하고 구분하는 추상적인 개념'이라고 정의합니다. 쉽게 말해서 실행 컨텍스트는 실행 가능한 코드가 실행되기 위한 환경이라고 말할 수 있습니다. 여기서 말하는 실행 가능한 코드는 아래와 같습니다. 전역 코드 : 전역 영역에 존재하는 코드..

Web 2022.04.20

javascript JSON.parse() / JSON.stringify() 사용법

JSON 내장 객체 자바스크립트에서는 JSON 포멧의 데이터를 간편하게 다룰 수 있도록 JSON이라는 객체를 내장하고 있습니다. 이 객체는 자바스크립트 코드를 브라우저에서 실행하든 Node.js 런타임에서 실행하든 상관없이 전역(global)에서 접근이 가능합니다. JSON 내장 객체는 JavaScript 객체와 JSON 문자열 간의 상호 변환을 수행해주는 두 개의 메서드를 제공합니다. JSON.parse() - JSON으로받은 것을 “구문 분석”하기위한 것입니다. JSON.stringify() - 객체 / 배열에서 JSON 문자열을 만드는 것입니다. JSON.parse - JSON 텍스트 문자열을 JavaScript 객체로 변환합니다. JSON.stringify - JavaScript 객체를 JSON ..

Web 2022.04.16

22.04.08 [항해99 33일차] 클로저 / 스웨거 사용법

🛑 오늘의 한줄평 👉🏻 미니프로젝트 시작 🛑 오늘 한 일 07:00 - 08:00 준비 08:00 - 09:00 노드 강의 09:00 - 09:30 미니프로젝트 발제 09:30 - 10:00 휴식 10:00 - 10:30 협업 세션 10:30 - 11:00 cs 스터디 11:00 - 12:00 와이어프레임 회의 12:00 - 13:30 점심 13:30 - 18:00 와이어프레임 회의 18:00 - 19:00 저녁 19:00 - 22:40 api 설계 🛑 오늘 할 일 미니프로젝트 와이어프레임 미니프로젝트 api 설계 DB schema 작성 강의 듣기 - node 기능 1시간 개인 프로젝트 작업 - 회원가입 로그인 기능 붙이기! 실행 context (+호출스택)- this / scope 이벤트 루프 프로토타..

항해99 2022.04.09

javaScript Coupling Decoupling 디자인 패턴 / 객체간 의존성 결합도

각 객체간 의존성/ 결합도가 높을수록 예상치 못한 문제(Side Effect)가 발생할 가능성이 높아집니다. 이를 해결할 수 있는 Decoupling이라는 개념이 존재하는데 Decoupling을 위한 디자인 패턴은 어떤게 존재할까요? [1]커플링이란? https://ui.toast.com/weekly-pick/ko_20150522 커플링 - 서로 다른 객체/ 모듈간의 관계를 의미한다. 관계의 방법은 조금씩 다르지만 거의 유사한 패턴이라 측정도 가능하다. 종류는 6가지가 있고, 각각의 커플링 점수가 높을수록 강한 결합을 의미한다. 1)Content Coupling - 5점 가장 강한 결합 단계이다. 특정 객체에서 다른 객체의 매서드를 직접 호출하거나 상태를 수정하는 형태의 코드를 뜻한다. 2)Common ..

Web 2022.04.03

22.04.01 [항해99 26일차] 트리구조 / 객체지향 프로그래밍 OOP

🛑 오늘의 한줄평 👉🏻 새로운 시작 🛑 오늘 한 일 07:00 - 08:30 준비/ 업로드및 하루계획 08:30 - 09:00 cs 공부 09:00 - 09:30 주특기 심화 발제 09:30 - 11:30 팀과제 11:30 - 12:00 cs 스터디 12:00 - 13:00 DNS 포스팅 13:00 - 14:00 점심 14:00 - 14:50 DNS 포스팅 14:50 - 15:40 휴식 15:40 - 17:30 테스트 코드 강의 17:30 - 19:00 저녁 19:00 - 20:00 cs 유튜브 🛑 오늘 할 일 개인 프로젝트 작업 주특기 숙련 - 상세페이지에 댓글달기 / 수정 / 삭제 코드분석 객체지향 프로그래밍 OOP https://poiemaweb.com/js-object-oriented-progra..

항해99 2022.04.03
728x90