평행우주 : world 1

🌏2장 CPU의 구조와 기능 CPU 수행 동작 순서대로 정리 1.명령어 인출 -기억장치로부터 명령어를 읽어옴 2.명령어 해독 -수행해야 할 동작을 결정하기 위하여 명령어 해독 3.데이터 인출 -명령어 실행을 위하여 데이터가 필요한 경우 기억장치 혹은 I/O장치로부터 데이터를 읽어옴 4.데이터 처리 -데이터에 대한 산술적 혹은 논리적 연산 수행 5.데이터 저장 -수행한 결과 저장 💫2.1 CPU의 기본 구조 CPU는 -산술논리연산장치(ALU) -레지스터 세트 -제어 유니트로 구성된다 산술논리연산장치 (ALU) -각종 산술 연산들과 논리 연산을 수행하는 회로로 이루어진 하드웨어 모듈 -산술연산(+,-,*,/) -논리연산(and,or,not) 레지스터 -CPU 내부에 위치한 기억장치 -액세스 속도가 컴퓨터 기..

개발을 공부하면서 느낀 점은 아주 많은 용어가 있고, 세세하게 구별한 만큼 의미가 각각 다르다는 것이다. 지금 공부하고 있는 코드스테이츠 블록체인 과정에서 지금껏 만난 페어분이 모두 관련 전공자거나 종사자였기 때문에.. 소통하면서 내가 각 용어를 제대로 이해하지 못했고, 잘못사용 하고 있음을 인지했다. 그리고 그게 소통에 있어서 매우 중요하다는 점도.. 용어 정리의 필요성을 느꼈다. 값 (value) 값은 식이 평가 되어 생성된 결과를 말한다 모든 값은 데이터 타입을 가진다 +) '변수' : 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 공간을 식별하기 위해 붙인 이름 '변수'에 할당 되는 것 : 값 평가 (evaluate) 식을 해석해서 값을 생성하거나, 참조하는 것을 의미한다 표현식 (ex..

호이스팅에 대해 공부하다가 변수참조 코드가 변수 선언문 앞에 있을 때 undefined 가 뜨는 것을 보고, 그렇다면 변수 값 할당이 변수 선언문 앞에 있을 때는 어떠할지 궁금해졌다. 변수 선언 실행 시점과 변수 호이스팅 console.log(js); // undefined 변수 참조 코드 let js; // 변수 선언 변수 선언보다 변수 참조 코드가 먼저 나온 경우, referenceError가 뜨지 않고 undefined가 뜬다. 이 결과를 이해하기 위해서는 1) 변수 선언 수행 단계 2) 호이스팅 에 대한 이해가 필요하다. 1) 변수 선언 수행 단계 자바스크립트 엔진은 변수 선언을 2단계에 거쳐 수행한다 선언 단계 : 변수 이름을 등록해 자바스크립트 엔진에 변수의 존재를 알린다 초기화 단계 : 값을..

const 값이 바뀌는 경우가 생겨, 그 이유를 탐구했다 const에 object를 선언 했을 때, 결과 값이 바뀌는 경우가 발생하는 이유 이를 이해하기 위해서는 '변수가 무엇을 담는 지'에 대한 이해가 필요하다. 변수에 할당되는 값은 primitive 와 object로 구분된다. primitive 값( boolean, null, undefined, number, string)은 데이터 자체가 변수에 담겨 있어 데이터 자체가 복사되어서 들어오지만, object 는 이 object를 가리키고 있는 주소(reference)가 들어있기 때문에 그 주소만 복사 되어서 들어온다 따라서 변수 const에 object를 할당하는 경우 항상 같은 reference를 찾아 출력이 될 것이고, reference 자체는 변..

CREATE - createElement document 객체의 createElement 메소드를 이용하여 새로운 div element 생성 document.createElement('div') 생성된 div element를 변수 tweetDiv 에 할당 const tweetDiv = document.createElement('div') 현재 createElement 메소드로 생성된 tweetDiv 엘리먼트는 공중에 떠있는 상태 화면에는 아무런 변화가 없음 아무것도 연결이 되어있지 않은 하나의 노드 상태 위 그림처럼 공중에 떠있는 엘리먼트를 확인하기 위해서는 APPEND 사용 APPEND 를 이용하면 실제 웹 페이지 상에 보이는 것을 확인 가능 APPEND에서, tweetDiv 를 트리 구조에 연결하게 ..

What is the DOM? DOM은 Document Object Model의 약자 HTML 요소를 Object(JavaScript Object)처럼 조작(Manipulation)할 수 있는 Model 자바스크립트를 사용할 수 있으면, DOM으로 HTML을 조작 가능 DOM은 프로그래머 관점에서 바라 본 HTML DOM을 이해하고 조작할 수 있으면, HTML을 단순한 문서에서 웹 앱으로 업그레이드 가능 DOM은 브라우저 환경에서 자바스크립트를 이용해 HTML을 조작 HTML 문서에 이미 작성되어 있는 엘리먼트 접근, 새로운 엘리먼트를 생성 또는 삭제 가능 HTML에 JavaScript 적용하기 HTML 문서에 포함되는 script 요소 웹 브라우저가 작성된 코드를 해석하는 과정에서 요소를 만나면, 웹 ..

와이어프레임(Wireframe) 웹 또는 앱을 개발할 때 레이아웃의 뼈대를 그리는 단계로 가장 큰 목적은 화면 영역 구분 말 그대로 "와이어로 설계된 모양"을 의미하며, 단순한 선이나, 도형으로 웹이나 앱의 인터페이스를 시각적으로 묘사한 것 전환 효과나, 애니메이션, 사용자 테스트같은 스타일링 요소나 UX(사용자 경험, User Experience)는 제외 따라서 인터페이스를 그림으로 표현하는 형식 대신, 각 영역에서 사용할 주요 태그를 메모하는 형식으로 와이어프레임을 짜는 것이 좋음 목업(Mock-up) 실제 제품이 작동하는 모습과 동일하게 HTML 문서를 작성하는 것 예를 들어 트위터 클론코딩에 앞서, 트윗 작성자, 트윗 내용, 작성한 날짜 등을 HTML 문서 내에 하드코딩하는 방식 레이아웃 리셋 H..

셀렉터 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 { } 형제 셀렉터 section ~ p { } 가상 클래스 a..