티스토리
관련 서비스
  • Symbols스토리 홈바로가기바로가기
  • 브런치브런치스토리바로가기바로가기
  • 카카오스토리카카오스토리바로가기바로가기

프론트엔드 개발
검색하기
블로그 홈

블로그 홈

프론트엔드 개발

taenami.tistory.com/m
신고

태나미 님의 블로그입니다.

구독자
3
방명록 방문하기
구독하기
공지 처음이라면? 모두보기

주요 글 목록

  • swiper안에 button영역 클릭 후 스와이프 안되는 현상 이슈 발생swiper영역 안에 버튼을 누르고 alert혹은 confirm창이 뜨고나서 버튼을 스와이프하면 스와이프가 되지않는 이슈 발생, pc모드에서는 잘되지만 모바일 디버깅시 발생 해결swiper 옵션 중 touchStartForcePreventDefault: true 속성 추가하여 브라우저의 기본 동작을 차단한다.touchstart이벤트에 대해 기본동작을 막아 Swiper의 동작이 강제적으로 우선 처리 되게 한다.  기존 접근 방법버튼을 눌러 alert가 나오면 이벤트 버블링을 하여 스와이퍼 동작이 차단된것 같아 vue 에서 @click.stop을 했는데도 소용이 없었다.이 방식은 잘못 접근하였는데 @click.stop은 클릭 이벤트의 전파를 막는 역할만 수행하며, Swiper와 관련된 터치 이벤트에.. 공감수 0 댓글수 0 2024. 12. 4.
  • vue composition API를 쓰고난 후 Setup 훅에서 Route와 Router에 접근하는 법 options API vue router를 App에 mount 시켜줘 mehods, computed등에서 this에 접근가능하여 this.$route 라던가 this.$router를 사용하여 접근하였음 - main.js import { createApp } from 'vue' import App from './App.vue' import router from "./router" createApp(App).use(router).mount('#app'); Composition API 사용 setup 훅 내부에서 'this' 접근할 수 없기 때문에 useRouter를 import 하여 사용해야 한다. import { useRouter, useRoute .. 공감수 0 댓글수 0 2023. 2. 16.
  • vue - computed parameter vue - computed parameter 사용하는 방법 보통 methods에 함수를 정의해 parameter를 넘기고 있었지만, computed를 사용할때도 parameter를 넘길 수 있는지 궁금했다. 아래와 같이 사용할 수 있는데, 보통 아래와 같을때는 methods에 함수를 정의하는 방식으로 사용할 수 있겠지만 어떨 때 다음과 같은 방식을 사용하는지는 좀 알아봐야겠다. {{ item }} 출처: https://velog.io/@nekonitrate/Vue.js-computed-%EC%97%90-Parameter-%EB%A5%BC-%EB%84%98%EA%B8%B0%EB%8A%94-%EB%B0%A9%EB%B2%95 공감수 0 댓글수 0 2022. 9. 2.
  • git branch 삭제 - remote 브랜치 삭제하는 방법 * 아래 명령어를 사용하면 local에 있는 branch가 아닌 remote에 있는 branch가 삭제된다는것을 잘 알고 사용해야 한다. git push origin --delete [branchName] [선택] remote에 있는 branch를 삭제하고 나서 local에도 있다면 삭제한다. - local 브랜치 삭제하는 방법 git branch -d [branchName] 강제로 제거해야한다면 git branch -D [branchName] 출처: https://www.lesstif.com/gitbook/git-delete-remote-branch-20776547.html https://backlog.com/git-tutorial/kr/stepup/stepup1_.. 공감수 0 댓글수 0 2022. 8. 30.
  • vue - input enter시 함수를 2번 호출하는 에러 수정 아래와 같이 enter를 눌렀을 경우 함수가 2번 호출되는 문제가 있었는데 해결한 경험을 공유하겠습니다 간단하게 keyup => keypress로만 수정하면 됩니다 수정이 완료되었다면 네트워크 탭에서 맞게 호출하고 있는지 확인해보세요 공감수 1 댓글수 0 2022. 8. 15.
  • vue input value 값 실시간 변경 감지 vue - input value값 변경 실시간 감지를 위해서 @input 사용 예시) onChange(event){ console.log(event.target.value) } 공감수 3 댓글수 0 2022. 8. 14.
  • zsh: command not found: code 맥os를 이용하여 zsh에서 code. 를 쳤을때 다음과 같은 오류 발견 zsh: command not found: code 해결방법 VSC에서 command + shift + p를 누르면 code 명령 설치를 눌러준다. 1. 정상 설치되었을때 2. 에러가 나면 permission denied unlink '/usr/local/bin/code' 다음 명령어를 입력 cd /usr/local/bin sudo rm -rf code 추가 에러 발생 터미널에서 path 잘못입력해서 어떤 명령어든 찾을 수 없다는 에러 발생 1. 터미널에 아래 명령어 입력 export PATH=%PATH:/bin:/usr/local/bin:/usr/bin 2. 다시 vi ~/.zshrc 에서 수정 3. source ~/.zshrc .. 공감수 2 댓글수 2 2022. 7. 21.
  • Nuxt + Typescript 먼저 Nuxt 공식 홈페이지에 나와있는 영어를 번역하면서 Typescript의 컨셉에 대해 살펴보고 적용하는 방법에 대해서 알아보겠습니다. TypeScript Concepts Nuxt 3는 코딩할 때 정확한 type 정보에 접근할 수 있도록 유용한 shortcut을 제공합니다. Type-checking 기본적으로 Nuxt는 성능상의 이유로 nuxi dev 또는 nuxi build를 실행할 때 type을 확인하지 않습니다. nuxt.config 파일의 typescript.typeCheck 옵션을 사용하여 빌드 또는 개발 시 type 검사를 활성화하거나 nuxi를 수동으로 type을 검사할 수 있습니다. yarn nuxi typecheck 위의 커맨드를 입력하고 typescript 및 vue-tsc를 설치.. 공감수 0 댓글수 0 2022. 5. 8.
  • Nuxt (version 3) Quick Start 해볼까? 이전 시간에는 Nuxt3 이론을 배웠다면, 이번에는 공식 홈페이지를 보며 직접 Nuxt3를 만들어 보겠습니다. Prerequisites Node.js* (latest LTS version) Visual Studio Code Volar Extension, 공식문서에는 추천하는 링크를 다운받으라고 하였으나, 되지 않아서 두번째꺼를 다운받았어요 Take Over Mode (recommended) TypeScript Vue Plugin (Volar) * Node.js 가 설치되어있다면, node --version으로 v14 or v16인지 확인해주세요~! * Take Over Mode를 활성화했거나 TypeScript Vue 플러그인(Volar)을 설치한 경우 *.vue 파일에 대한 shim 생성을 비활성화할 .. 공감수 1 댓글수 0 2022. 5. 7.
  • Nuxt (version 3) concept에 대해 Nuxt js 공식 홈페이지에서 공부하면서 번역한 것 글을 정리해보겠습니다. Nuxt 3 버전인 점 참고해주세요. What is Nuxt? Nuxt의 목표는 뛰어난 개발자 경험을 염두에 두고 직관적이고 성능이 뛰어난 웹 개발을 만드는 것입니다. Why Nuxt? Nuxt가 무엇인지 이해하려면 최신 애플리케이션을 만드는 데 필요한 사항을 이해해야 합니다. reactivity 및 web components를 사용할 수 있는 JavaScript 프레임워크인 Vue.js를 선택했습니다. 개발 중 핫 모듈 교체를 지원하고 프로덕션용 코드를 번들로 제공하는 번들러인 webpack 5와 Vite를 모두 지원합니다. 레거시 브라우저를 지원하면서 최신 JavaScript 구문을 작성하는 변환기인 esbuild를 사용합니.. 공감수 0 댓글수 0 2022. 5. 7.
  • class binding props에 class binding시 각자 다른 값이 들어가야 하거나 안들어가도 될때 Before Parent.vue 다음과 같은 Parent.vue에서 button을 하나의 컴포넌트로 만들때 서로 다른 class를 바인딩 시키는 법을 알아보겠습니다. A B C After Parent.vue Child.vue {{title}} addClass가 있던 없던 바인딩된 값이 class에 추가로 들어오는 것을 확인할 수 있습니다. 이외에도 상황에 따른 class binding을 추가하겠습니다~! 댓글에 자유롭게 자기가 사용하고 있는 binding 방법을 적어주시고 같이 소통해요! 공감수 0 댓글수 0 2022. 5. 3.
  • [Git hooks] git commit시 branch name 자동반영 이번에 지라 처음 사용하면서 알아본 것 feature 브런치 feature/SCRUM-0000_whatEver 같이 설정 기존 commit 규칙: [SCRUM-0000] commit 내용 [SCRUM-0000]을 자동 반영하고 싶어서 알아본 것 Git hook Git Hook란 Git Hooks 는 Git과 관련한 어떤 이벤트가 발생했을 때 특정 스크립트를 실행할 수 있도록 하는 기능이다. 크게 클라이언트 훅 과 서버 훅 으로 나뉘는데 클라이언트 훅 은 커밋, Merge 가 발생하거나 push 가 발생하기 전 클라이언트에서 실행하는 훅이다. 반면 서버 훅 은 Git repository로 push 가 발생했을 때 서버에서 실행하는 훅이다. 설정 방법 프로젝트 내에 숨겨진 파일. git에 들어가면 hooks.. 공감수 0 댓글수 0 2022. 4. 13.
  • Cypress Test해보기 (with Vanilla js) 앞에서 알아본 Cypress를 직접 실행해보면서 접근해보겠습니다. Cypress 설치 공식 홈페이지에 나와있는 설치 요구사항으로는 아래와 같습니다. Operating Systemp macOS 10.9 and above (64-bit only) Linux Ubuntu 12.04 and above, Fedora 21 and Debian 8 (64-bit only) Windows 7 and above (64-bit only) Node.js npm 사용시 Node.js v12 혹은 v14, 그 이상을 사용하라고 합니다 저는 macOS에서 다음과 같은 버전을 사용하겠습니다. 설치 아래 두가지중 선택하셔서 터미널에 명령어를 입력하면 됩니다. Node 및 npm을 사용하지 않다면 여기를 참고하세요 npm instal.. 공감수 0 댓글수 0 2022. 3. 21.
  • Cypress에 대해 Cypress를 공식 홈페이지에서 보며 정리한 내용을 다뤄보겠습니다. Cypress란? Cypress는 자바스크립트 E2E 테스트 프레임워크입니다. 개발자 또는 QA 엔지니어가 Cypress를 이용하여 테스트를 할 수 있습니다. Cypress를 이용하여 다음과 같은 테스트를 할 수 있습니다. End-to-end tests Integration tests Unit tests Cypress 특징 Cypress의 특징은 다음과 같습니다. 완벽한 E2E Tesing을 경험할 수 있습니다. Cypress Test Runner를 설치하고 로컬에서 테스트를 작성합니다. CI 테스트를 구축 및 결과를 기록합니다. Cypress는 테스트가 실행될 때 스냅샷을 만듭니다. 각 단계에서 정확히 어떤 일이 발생했는지 확인할 수.. 공감수 0 댓글수 0 2022. 3. 21.
  • 맥북에서 버즈프로 및 에어팟 연결시 한쪽만 들릴때 해결법 버즈 프로를 맥북 m1에 연결하면, 이어폰 한쪽에서만 소리가 들리는 문제가 있어 해결방법을 알아보겠습니다. 해결방법 1. 시스템환경설정 들어가기 command + space 2. 사운드 들어가기 3. 출력 클릭 4. 출력에서 해당 기기를 선택하세요. (버즈 프로나 에어팟 등) 선택한 기기에 대한 설정에서 균형에서 한쪽으로 치우쳐져 있는 것을 가운데로 조정합니다. 잘 해결되셨으면 좋겠습니다 공감수 2 댓글수 1 2022. 3. 20.
  • Vue Vue.js란? 웹 페이지 화면(UI)을 개발하기 위한 프런트엔드 프레임워크입니다. MVVM 패턴을 따르며, 애플리케이션 로직과 UI를 분리하기 위해 설계되었습니다. MVVM 패턴이란? Vue.js는 MVVM 패턴의 ViewModel 계층에 중점을 둡니다. 양방향 데이터 바인딩을 통해 View와 Model을 연결합니다. MVVM 패턴의 ViewModel 레이어에 해당하는 View 단 라이브러리 View가 특정 모델에 종속되지 않도록 모델(로직)을 분리한 패턴입니다. 간단히 View와 Movel, ViewModel을 분리하여 독립적인 개발을 할 수 있도록 하여, 테스트, 유지 보수, 재사용성을 높인 패턴입니다. 구성요소 뷰(View) : 보여지는 부분, UI를 다루는 역할을 하며, 비즈니스 로직이 아닌 .. 공감수 0 댓글수 0 2022. 3. 18.
  • 자료구조 자료구조(data structure)는 컴퓨터 과학에서 효율적인 접근 및 수정을 가능케 하는 자료의 조직, 관리, 저장을 의미한다. 자료 구조는 데이터 값의 모임, 또 데이터 간의 관계, 그리고 데이터에 적용할 수 있는 함수나 명령을 의미한다. - 위키백과 자료구조의 종류 선형 구조 : 한 종류의 데이터가 선처럼 길게 나열된 자료구조. 배열 해시 스택 큐 덱 연결리스트 비선형 구조 : 선형 구조가 아닌 모든 자료구조. i번째 값을 탐색한 뒤의 i+1이 정해지지 않는 구조 그래프 트리 자바스크립트의 자료구조 배열(Array) 배열은 대부분의 프로그래밍 언어에서, 가장 간단하고 가장 많이 쓰이는 자료구조형이다. 일반적인 배열은 인덱스로 배열 요소에 빠르게 접근할 수 있습니다. 하지만 특정 요소를 탐색하거나 .. 공감수 0 댓글수 0 2022. 3. 3.
  • 빅오표기법 (big-O) Big-O란 무엇인가? 알고리즘 성능을 수학적으로 표기해주는 표기법 시간과 공간 복잡도를 표현 데이터나 사용자의 증가율에 따른 알고리즘의 성능을 예측하는게 목표, 상수와 같은 숫자들은 모두 1이 된다. 시간복잡도 시간복잡도란 알고리즘이 문제를 해결하기 위한 시간(연산)의 횟수를 말한다. 알고리즘을 평가하는데 있어 수행시간과 메모리 사용량을 평가기준으로 두는데 수행시간에 해당하는 것이 시간 복잡도 Time Complexity 메모리 사용량에 해당하는 것이 공간 복잡도 Space Complexity 연산 횟수를 카운팅 할때 3가지 경우가 있다. 최선의 경우 Best Case 최악의 경우 Worst Case 평균적인 경우 Average Case 빅오표기법 예제 O(1) constant time 입력 데이터 크.. 공감수 0 댓글수 0 2022. 2. 24.
  • webpack을 이용한 React + Typescript 셋팅하기 '프론트엔드 개발환경의 이해'강의를 듣고 정리를 하였는데, 이해를 바탕으로 직접 webpack과 babel을 세팅을 해보고자 합니다. 기존에는 CRA를 이용하여 React를 쉽게 바로 쓸 수 있는 장점이 있었기 때문에 사용하였습니다. CRA를 이용하면 Webpack 및 Babel 등 설정하기 까다로운 것들을 편하게 쓸 수 있었는데, 나중에 이러한 구성요소들을 변경을 하고자 할 때 이해해야 할 수 있기 때문에 직접 리액트 환경을 Webpack을 통해서 구축해보는 시간을 갖도록 하겠습니다. React + Typescript + Webpack 구성 먼저 package manager는 이 글을 참고하여 yarn으로 진행하도록 하겠습니다. node 14.17.3, yarn: 1.22.17 버전으로 진행하였습니다... 공감수 0 댓글수 0 2022. 1. 17.
  • Next.JS 성능 최적화해보기 Webpack과 Bundle.js Webpack은 css,js,file 등을 하나의 파일로 만드는 만큼 용량이 클 수 밖에 없습니다. 어떻게 이 용량을 줄일 수 있는 지 알아보겠습니다. 성능 측정 PageSpeed Insights 측정 도구 Tool: @next/bundle-analyzer cmd yarn add @next/bundle-analyzer next.config.js const withPlugins = require('next-compose-plugins') const withBundleAnalyzer = require('@next/bundle-analyzer')({ enabled: process.env.ANALYZE === 'true', }) module.exports = withPlugin.. 공감수 0 댓글수 0 2022. 1. 11.
  • [우아한 Tech] - 상태관리와 반응형 프로그래밍 유튜브 채널 우아한 Tech에서 본 영상을 다시 글로 보기 위해 만들었습니다. 이미지와 내용 출처는 하단에 있습니다. 목표 상태관리란 무엇인가? 반응형 프로그래밍이란 무엇인가? 상태(state)란? 변화하는 데이터 UI에 동적으로 표현되는 데이터, 사용자에 action에 따라서 변경될 수 있는 컴포넌트의 부분, 자바스크립트의 객체 상태관리란? 변화하는 데이터관리 여러 컴포넌트 간에 데이터 전달과 이벤트 통신을 한곳에서 관리하는 것 상태관리는 왜 필요할까? 데이터가 바뀌어도 페이지가 렌더링 되지 않게 하기 위해 상태가 너무 복잡하기 때문이다, 상태들이 복잡하게 얽혀있다면, 상호간에 의존성이 많아지게 되어 UI가 어떻게 변하는지 알기 어려울 수 있기에 효율적으로 관리해야한다. 컴포넌트는 각각 다르지만, 사용.. 공감수 1 댓글수 0 2022. 1. 5.
  • NextJs - getServerSideProps async await, Promise.all 아래 예제에는 NextJs 안에서 getServerSideProps 안에서 one, two, three까지 3개에 api에 요청하여 데이터를 가져오고 있습니다. 가져오는 데이터의 크기가 크지 않다면 이렇게 사용할 수 있지만, 가져오는 데이터의 크기가 크거나, 3개의 api요청이 아닌 1000개의 api요청 같을 때는 느려질 수 있습니다. 어떻게 고칠 수 있을까요? example) export const getServerSideProps = async function (ctx) { const one = await fetchJson(`${process.env.NEXT_PUBLIC_ENV_VARIABLE}/api/~`, { method: 'GET', }); const two = await fetchJson(`.. 공감수 0 댓글수 0 2021. 12. 10.
  • [우아한 Tech] - 실행컨텍스트 유튜브 채널 우아한 Tech에서 본 영상을 다시 글로 보기 위해 만들었습니다. 이미지와 내용 출처는 하단에 있습니다. 이번 내용은 실행컨텍스트 구성 중 Record와 Outer에 집중하여 보겠습니다. 목차 1. Record(EnvironmentRecord)로 JS 호이스팅 이해하기 2. Outer(Outer Environment Reference)로 JS 스코프체이닝 이해하기 3. Execution Context 정리 1. Record로 JS 호이스팅 이해하기 console.log(laptop); // undefined var laptop = "macbook"; console.log(laptop); // macbook 위 예제 첫번째 줄에서 호이스팅이 발생하여 undefined를 출력되는 것을 볼 수 .. 공감수 1 댓글수 0 2021. 11. 30.
  • [m1 homebrew 설치 Warning 해결] /opt/homebrew/bin is not in your PATH 이번에 새로산 m1 pro 에서 homebrew 설치하다 보면 Warning 이 나타났는데요. command에서 brew 명령어를 사용할 수 없었습니다. 간단하게 따라하면서 고쳐보겠습니다. Warning을 자세히 보면, Next Steps에 두 줄을 커맨드에 add 하라고 나와있습니다. Warning 해결하는 법 1. homebrew가 설치가 되어있지 않다면, - homebrew 설치: https://brew.sh/index_ko /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 2. 아래 명령어 한줄씩 입력 echo 'eval "$(/opt/homebrew/bin/brew shel.. 공감수 15 댓글수 3 2021. 11. 27.
  • 코어 자바스크립트 - 클래스 이 글은 코어 자바스크립트 책에서 클래스를 공부하고 정리하는 목적으로 남깁니다. 목표 클래스와 인스턴스의 개념을 이해할 수 있습니다. 자바스크립트는 어떻게 클래스 상속을 구현한 것처럼 보이는지 알 수 있습니다. 목차 클래스와 인스턴스의 개념 이해 자바스크립트의 클래스 클래스 상속 ES6의 클래스 및 클래스 상속 정리 클래스와 인스턴스의 개념 이해 자바스크립트는 프로토 타입 기반 언어라서 '상속'개념이 존재하지 않지만, ES6 이후 클래스 문법이 추가되고, 클래스 문법에서도 일정 부분은 프로토타입을 활용하고 있습니다. class라는 의미는 '계급, 집단, 집합'등의 의미로 번역됩니다. 프로그래밍 언어적으로도 동일한 개념으로 접근하면 됩니다. 클래스(class)는 어떤 사물의 공통 특성을 모아 정의한 추상적.. 공감수 3 댓글수 2 2021. 10. 11.
  • 코어 자바스크립트 - 프로토타입 이 글은 코어 자바스크립트 책에서 프로토타입을 공부하고 정리하는 목적으로 남깁니다. 목표 어떤 생성자 함수를 함께 호출하면 새로운 인스턴스가 생성되는 과정을 알 수 있습니다. 프로토타입과 프로토타입 체이닝을 알 수 있습니다. 목차 프로토타입의 개념 이해 프로토타입 체인 정리 프로토타입 개념 이해 자바스크립트는 프로토타입 기반 언어입니다. 위키백과에서 프로토타입 기반 언어를 다음과 같이 설명합니다. 프로토타입 기반 언어는 클래스 기반 언어에서 상속을 사용하는 것과는 다르게, 객체를 원형(프로토타입)으로 하는 복제 과정을 통해 객체의 동작 방식을 재사용 할 수 있게 한다. - 위키백과 클래스 기반 언어에서는 '상속'을 사용하지만 프로토타입 기반 언어에서는 어떤 객체를 prototype으로 삼고 이를 복제(참.. 공감수 1 댓글수 1 2021. 10. 8.
  • 코어 자바스크립트 - 클로저 이 글은 코어 자바스크립트 책에서 클로저를 공부하고 정리하는 목적으로 남깁니다. 목표 클로저의 개념과 메모리 관리에 대해 알 수 있습니다. 커링함수에 대해 알 수 있습니다. 목차 클로저의 의미 및 원리 클로저와 메모리 관리 클로저 활용사례 정리 클로저의 의미 및 원리 클로저는 함수와 그 함수가 선언될 당시의 lexical environment의 상호관계에 따른 현상 - MDN 예시 1) var outer = function() { var a = 1; var inner = function() { console.log(++a); }; inner(); }; outer(); // 2 함수 outer의 내부 함수인 inner 함수에서는 a를 선언하지 않았기 때문에, environmentRecord에서 값을 찾지 .. 공감수 1 댓글수 0 2021. 10. 7.
  • 코어 자바스크립트 - 콜백 함수 이 글은 코어 자바스크립트 책에서 콜백 함수를 공부하고 정리하는 목적으로 남깁니다. 목표 콜백 함수의 개념과 비동기 개념, 비동기 제어에 대해서 알 수 있습니다. 목차 콜백함수란? 콜백 함수는 함수다 콜백 함수 내부의 this에 다른 값 바인딩하기 콜백 지옥과 비동기 제어 정리 콜백 함수란? callback은 '호출하다'는 의미인 call과 '뒤돌아오다' back의 합성어로 '되돌아 호출해달라'는 의미입니다. 콜백 함수(Callback Function)는 다른 함수나 메서드에게 인자로 넘겨주는 함수입니다. 콜백 함수를 넘겨받은 코드는 이 콜백 함수를 필요에 따라 적절한 시점에 따라 실행합니다. 콜백 함수는 함수다 콜백 함수는 함수입니다. 메서드를 콜백 함수로 전달한 경우, 메서드가 아닌 함수로서 호출됩니.. 공감수 1 댓글수 0 2021. 10. 4.
  • 코어 자바스크립트 - this 이 글은 코어 자바스크립트 책에서 this를 공부하고 정리하는 목적으로 남깁니다. 목표 여러 상황에서의 this가 어떻게 결정되는지 알 수 있습니다. this를 어떻게 바인딩할 수 있는지 알 수 있습니다. 목차 상황에 따라 달라지는 this 명시적으로 this를 바인딩하는 법 정리 1. 상황에 따라 달라지는 this 자바스크립트에서 this는 실행 컨텍스트가 생성될 때 함께 결정됩니다. this는 함수를 호출할 때 결정된다고 할 수 있습니다. 어떤 상황에서 this가 값을 결정하는지 알아보겠습니다. 1 - 1. 전역 공간에서의 this 전역공간인 this는 전역 객체를 가리키는데, 브라우저 환경에서의 전역 객체는 window이고, Node.js 환경에서는 global 입니다. 자바스크립트의 모든 변수는 .. 공감수 1 댓글수 0 2021. 10. 2.
  • 코어 자바스크립트 - 실행 컨텍스트 이 글은 코어 자바스크립트 책에서 실행 컨텍스트를 공부하고 정리하는 목적으로 남깁니다. 목표 실행 컨텍스트란 무엇이고, 실행 컨텍스트의 구조에 대해서 알 수 있습니다. 호이스팅과 스코프가 무엇인지 알 수 있습니다. 목차 실행 컨텍스트란? VariableEnvironment LexicalEnvironment this 정리 실행 컨텍스트란? 실행 컨텍스트를 보기 앞서, Stack과 Queue에 대해 간략히 알아보겠습니다. Stack, Queue Stack: LIFO (Last In First Out) Queue: FIFO (First In First Out) Stack에서는 가장 마지막에 들어온 d,c,b,a 순으로 데이터를 꺼낼 수 있습니다. Queue에서는 제일 먼저 들어온 a,b,c,d 순으로 데이터를.. 공감수 2 댓글수 0 2021. 9. 28.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.