본문 바로가기

분류 전체보기173

Code States 13일차 - 스코프 스코프와 주요 규칙 범위가 중괄호(블록) 또는 함수에 의해 나뉘어지고, 그 범위를 스코프라고 부른다. 스코프는 "변수 접근 규칙에 따른 유효 범위"이다. 변수 접근 규칙에 따른 유효 범위 안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만 반대는 불가능 스코프는 중첩이 가능 가장 바깥의 스코프는 특별히 전역 스코프(Global Scope)라고 부름 전역이 아닌 다른 스코프는 전부 지역 스코프(Local Scope) 지역 변수는 전역 변수보다 더 높은 우선순위를 가짐 스코프의 종류 블록 스코프(block scope) : 중괄호 기준으로 범위가 구분 함수 스코프(function scope) : function 키워드가 등장하는 함수 선언식 및 함수 표현식 유의해야 할 점 화살표 함수는 블록 스코프로 취급된다.. 2021. 8. 4.
Code States 13일차 - 원시 자료형과 참조 자료형 원시 자료형 깊게 이해하기 자바스크립트에서 원시 타입의 데이터(primitive data types; 원시 자료형)는 객체가 아니면서 method를 가지지 않는 6 가지의 타입 string, number,bigint, boolean, undefined, symbol, (null) 을 말한다. 왜 원시 자료형이라고 부르나요? 'string', 42, true, false, undefined // 데이터가 "하나"의 정보를 담고 있습니다. 원시 자료형은 모두 "하나"의 정보, 즉, 데이터를 담고 있다. 옛날에 어떻게 코드를 작성했는지를 돌아보면, 왜 이런 단순한 데이터가 "원시적인" 데이터라고 이야기 하는지 조금은 더 쉽게 이해하실 수 있다. 그 때는 데이터 저장소(메모리)의 용량이 제한되어 변수 하나에 데.. 2021. 8. 4.
Code States 12일차 - CSS 중급 CSS Selector 셀렉터 h1 { } div { } 전체 셀렉터 * { }​ Tag 셀렉터 section, h1 { }​ ID 셀렉터 #only { }​ class 셀렉터 .widget { } .center { }​ attribute 셀렉터 (암기할 필요는 없다) a[href] { } p[id="only"] { } p[class~="out"] { } p[class|="out"] { } section[id^="sect"] { } div[class$="2"] { } div[class*="w"] { }​ 후손 셀렉터 header h1 { }​ 자식 셀렉터 (후손 셀렉터와의 차이를 반드시 알고 있어야 한다) header > p { }​ 인접형제 셀렉터 section + p { }​ 형제 셀렉터 sectio.. 2021. 8. 3.
Code States 10일차 - 배열, 객체 배열 배열은 순서가 있는 값이다. 값은 요소(element)라고 한다. 순서는 인덱스(index)라고 부르며, 1이 아닌 0부터 번호를 매긴다. 배열 선언하기 // 대괄호로 선언하기 let myNumber = [73, 98, 86, 61, 96]; // Array 생성자로 선언하기 let myNumber = new Array(73, 98, 86, 61, 96); // 값은 인덱스로 접근한다. // "myNumber라는 배열의 3번째 인덱스"를 조회하려면 myNumber[3]; // 61 // "myNumber라는 배열의 3번째 인덱스"의 값을 변경하려면 myNumber[3] = 200; myNumber; // [73, 98, 86, 200, 96]; // myNumber라는 배열의 길이를 알아내려면 my.. 2021. 7. 30.
Code States 8일차 - CLI 기본 명령어 기본적인 명령어 프롬프트(Prompt) 터미널은 CLI(Command-Line Interface)이다. 입력하는 글자와 출력되는 글자로 컴퓨터와 소통할 수 있다. 컴퓨터가 출력하는 글자를 읽을 수 있어야 한다. pwd : 현재 위치 확인하기 pwd는 print working directory의 약자이다. 여기서 말하는 디렉토리(directory)는 폴더라고도 한다. CLI에서 폴더를 열거나 닫으면서 이동하면, 현재 위치가 헷갈릴 수 있다. 이 때 명령어 pwd를 입력하고 Enter(엔터 키)를 누르면, 컴퓨터는 현재 작업중인 폴더의 위치를 출력한다. mkdir : 새로운 폴더 생성하기 CLI에서 폴더를 생성하기 위해 사용하는 명령어인 mkdir은 make directories의 약자로, 폴더를 만들라는 .. 2021. 7. 28.
Code States 6일차 - CSS 기초 CSS 소개 CSS는 스타일링을 위한 도구입니다 컨텐츠의 배치와 위치 (레이아웃 디자인) 텍스트를 강조하거나 밑줄을 치는 등, 최소한의 타이포그래피 (Typography) 위의 요소를 갖추고 있으면 더 나은 사용자 경험(UX, User expirenece)을 제공할 수 있다. 기존 웹 페이지에 다른 CSS 파일을 적용해 활자 매체로 출판을 할 수도 있거나, 색약이나 장애인이 웹 페이지를 이용할 때 도움을 줄 수도 있다. CSS에 대한 오해 CSS는 디자이너의 영역이다? CSS를 작성해서 간단한 UI를 만드는 일은 개발자의 기본적인 소양이다. 콘텐츠를 적당한 위치에 배치하는 레이아웃 디자인은 디자이너가 아니라도 할 수 있어야만 한다. 일반 사용자를 대상으로 하는 어플리케이션은, UI(User Interfa.. 2021. 7. 26.