[코드잇 스프린트 풀스택 4기] 렉시컬 스코프(Lexical Scope) 렉시컬 스코프란함수가 실행될 때가 아닌 선언될 때를 기준으로 스코프가 결정된다는 것. 스코프 결정 시점: 함수가 정의된 위치를 기준으로 스코프가 결정스코프 체인: 함수 내부에서 변수를 참조할 때, 먼저 내부 스코프에서 변수를 찾고, 없으면 외부 스코프로 이동하여 변수를 찾음. 이러한 과정을 스코프 체인이라고 함상위 스코프 참조: 내부 함수는 자신이 정의된 외부 환경(상위 스코프)을 참조할 수 있음. 이를 통해 함수가 호출되는 위치와 상관없이 일관된 스코프를 유지 const outerVar = 'I am outside!';function outerFunction() { const innerVar = 'I am inside!'; function innerFunction() { cons.. [코드잇 스프린트 풀스택 4기] 자바스크립트의 this thisthis는 실행 컨텍스트에 따라 그 값이 결정되며, 현재 실행 중인 함수 또는 메서드의 "소유자"를 가리킵니다.전역 컨텍스트에서의 this전역 객체를 가리킴. 브라우저에서는 windowconsole.log(this); // 브라우저에서는 window 객체를 출력함수 내에서의 this일반 함수에서는 전역 객체엄격 모드에서는 undefinedfunction regularFunction() { console.log(this); // window 또는 global 객체}function strictFunction() { 'use strict'; console.log(this); // undefined}regularFunction();strictFunction();객체의 메서드로 호출될때는 .. [코드잇 스프린트 풀스택 4기] 자바스크립트의 var, let, const var는 재선언, 재할당이 가능let은 재할당만 가능const는 모두 불가var는 변수를 만들기도 전에 호출이 가능(hoisting)그러나 초기화는 실제 코드 위치에서 수행되므로 선언 전에 변수를 사용하면 undefinedlet: 초기화 이전에 접근하면 reference errorconst: 선언 전에 접근하면 reference error(선언과 동시에 초기화 필요, 값의 재할당 불가)console.log(title); // 에러가 아닌 undefined 출력var title='test';conssole.log(title); // 'test'출력스코프var는 function 단위로만 구분function안에서 선언된 경우만 지역변수if나 for문 등에서 생성하더라도 전역변수처럼 작동let과 const는 {.. [코드잇 스프린트 풀스택 4기] 브라우저의 동작 원리 브라우저 작동 원리브라우저의 구조사용자 인터페이스: 주소표시줄, 버튼 등브라우저 엔진: UI와 랜더링 엔진 사이의 동작을 제어랜더링 엔진: 요청한 콘텐츠를 표시통신: 네트워크 호출JS 해석기UI 백엔드자료 저장소: 로컬 저장통신 과정사용자가 브라우저에 URL 입력URL 정보를 DNS로 보냄DNS에서 IP주소를 받아 정보를 받아올 컴퓨터(웹서버) 정보 확인URL 정보를 http프로토콜을 통해 요청 메시지 전송TCP/IP 이용http프로토콜을 통해 다시 URL정보로 변환되어 웹서버에 전송웹서버에서 URL에 맞는 정보를 찾음http를 통해 응답 메시지로 전송TCP/IP 이용http를 통해 해당 정보를 브라우저로 전달브라우저 엔진을 통해 사용자가 볼 수 있는 정보로 변화되어 화면에 출력랜더링 과정DOM, CSS.. [코드잇 스프린트 풀스택 4기] 시멘틱 태그란 무엇이며 어떤 장점이 있는가? 시멘틱 태그란 header, footer, section, nav 등을 의미한다.이러한 시멘틱 태그를 사용했을 경우의 장점은 아래와 같다.1. 코드 가독성 향상- 위 태그는 div와 기능상 동일하게 작용하므로 div를 사용해도 되지만 모든 영역에 div를 적용하게 되면- 코드를 볼 때 어디가 어떤 영역인지 알기가 어렵게 된다.- 물론 div에 class나 id를 정의하여 네이밍을 해도 되지만 시멘틱 태그가 좀 더 직관적으로 코드를 볼 수 있다.2. 사이트 정보를 효과적으로 전달할 수 있다- 검색 엔진 등이 사이트를 크롤링할 때 시멘틱 태그를 기준으로 정보를 판단하고 읽을 수 있으므로 효과적으로 사이트의 정보를 전달할 수 있다.3. 웹 접근성 강화- 시각 장애인을 위한 스크린 리더 등을 통해 사이트를 분석.. [코드잇 스프린트 풀스택 4기] CSS의 Cascading이란? CSS는 웹문서에 스타일을 적용한다.이 과정에서 같은 요소에 적용되는 스타일은 여러 가지 이유로 충돌이 발생할 수 있다.이럴때 일정한 우선 순위를 두고 스타일이 적용되는데 이를 cascading이라고 한다.cascading은 중요도, 명시도, 코드 작성 순서에 의해 결정된다.1. 중요도- CSS를 어디에 선언했는지를 의미한다. - 크게 사용자 스타일, 작성자 스타일, 브라우저 스타일로 나눌 수 있다.- 브라우저 스타일은 크롬이나 사파리 등의 브라우저가 기본으로 갖고 있는 스타일을 의미하며- 작성자 스타일은 웹 문서를 만드는 사람이 설정한 스타일을 의미한다. (html파일내 style 또는 css파일)- 사용자 스타일은 사용자가 컴퓨터내에서 설정한 스타일 옵션을 의미한다.- 사용자 스타일 > 작성자 스타일.. 아이패드 외장키보드 사용시 카카오톡 우측하단 팝업 없애기(매직키보드) 제목이 어렵지만 아마도 검색해서 오신 분들은 다 아실겁니다. 바로 아래 사진!! 문제의 그 놈. 빨간 동그라미로 표시한 저 부분때문에 뒤에 가려진 이모지 버튼을 사용할 수가 없다. 엄청 거슬려... 검색 결과 키보드에서 '단축키'를 끄면 된다는데.. 그래서 끄고 다시 봤는데.. 뭐지? 그대로다! ㅠㅠ 짐작컨대 많은 분들이 나와 같은 절망을 겪으며 이것저것 옵션을 꺼보셨을 것 같다. 그러나 문제는 다른 곳에 있었으니 ㅠㅠ 단축키를 비활성화한 후에 카카오톡을 종료하고 재실행하면 안 보인다.. 덴장..이런거였다니.. 암튼 혹시라도 같은 불편 겪으실 분들을 위해 짧게 기록한다. 도움이 되길 [Flutter] Firebase 설정 오류 - build.gradle(app) Properties, GradleException이 Cannot Resolve Symbol 인 경우 FireBase 설정을 하는 과정에서 app의 build.gradle에 에러가 발생했다. Properties와 GradleException에 공포의 빨간줄이 생기고, Cannot Resolve Symbol이라는 에러 표시.. 나도 초보인지라 자세한건 잘 모르겠고, 해결책만 정리하겠다. 1. Properties 오류 수정 안드로이드 스튜디오에서 File - Project Structure를 누르면 아래와 같은 창이 뜬다. Modules를 선택하고 관련 프로젝트명을 선택한다. (화면에서는 Instagram) 우측의 탭에서 'Dependencies'를 선택하면 Module SKD가 나오는데 no SDK로 나올 것이다. (도대체 왜????) 여튼 거기서 적합한 버전을 선택해준다. 나는 32를 선택. (생성된 프.. 이전 1 2 3 4 다음
