본문 바로가기

바닐라코딩 사전학습45

메모리 구조 / 변수 생성원리 / 가비지컬렉터 이 글은 카레유님의 글을 참조해서 작성하였습니다. https://curryyou.tistory.com/ 카레유 여행, 맛집, 역사, IT 프로그래밍에 관심이 많습니다. HTML, CSS, JavaScript, Android, Java, Kotlin, Python 을 주로 개발합니다. curryyou.tistory.com 메모리 구조, 데이터 저장/참조 원리 1. 메모리 구성 컴퓨터 메모리는 1byte(8bit) 크기의 메모리셀 여러개로 구성된다. 2. 메모리 셀 각 메모리 셀은 고유한 주소값을 가지며 메모리셀(1byte)단위로 데이터를 저장하고 읽는다. 3. CPU와 메모리 역할 CPU는 메모리에 저장된 값을 꺼내와 연산하고 연산 결과를 다시 메모리에 저장한다. 4. 데이터 저장 방식 용량이 큰 데이터는.. 2021. 12. 27.
Primitive / Reference Primitive 타입 자료형 string Boolean Number NUll undefined symbol Primitive 타입 자료형은 값의 '모양'이 같다면 서로 같은 값이다. let a = 10; const b = a; a = 30; console.log(b); 위의 결과는 10이 나온다. 변수(a)로 할당한 값(b)은 이후에 변수값(a)이 바뀌더라도 되돌아가서 할당한 값(b)을 바꾸지 않는다. let b = a;라도 같은 결과이다. Primitive자료형은 값이 재할당되면(바뀌면) 기존메모리주소에 저장된 값을 변경하는 것이 아니라 새로운 메모리를 확보하여 값을 저장하고 변수에 새로운 값이 입력된 메모리주소를 다시 할당한다. let a = 10; let b = 20; a = 20; 위의 코드는 .. 2021. 12. 27.
Scope Quiz Q1) function foo () { var a = 5; for (var i = 0; i < a; i++) { console.log(a); } console.log(i); // 무엇이 출력될까요? } foo(); 예상 답 : 5 예상 이유 : 함수 foo()가 실행되면 a가 선언되고 5가 할당된다. for문에서 i가 선언되고 a가 필요하므로 a를 찾는다. 같은 scope에 a가 선언되어 있으므로 a의 값을 가져와서 for문을 돌린다. console.log(i)에서 i를 찾게되는데 for문은 함수가 아니기 때문에 i는 console.log(i); 문과 같은 scope에 있다. 따라서 error가 아닌 i가 출력된다. 정답 : 5 Q2) var a = 1; function bar () { function .. 2021. 12. 27.
Hoisting 호이스팅이란? 코드를 실행하기 전 변수선언/함수선언을 해당 스코프의 최상단으로 끌어올리는 것을 말한다. 물리적으로 코드를 끌어올리는 것은 아니다. JS엔진은 코드를 실행하기 전 실행 가능한 코드를 형상화하고 구분하는 과정을 거친다. JS엔진은 코드를 실행하기 전 실행 컨텍스트를 위한 과정에서 모든 선언(var, let, function 등)을 스코프에 등록한다. 호이스팅으로 인해 이미 변수선언/함수선언을 한 것으로 취급되어 선언문보다 참조/호출이 먼저 나와도 오류 없이 동작한다. var, let, const의 호이스팅 var로 선언한 변수는 선언문보다 먼저 참조해도 에러가 나지 않는 반면 let과 const는 참조에러(Reference Error)가 발생한다. 이는 let, const로 선언한 변수는 스.. 2021. 12. 27.
Scope, Lexical Scope(정적 스코프) var vscope = 'global'; function fscope(){ console.log(vscope); } fscope(); //결과: global 함수 밖에서 변수를 선언하면 그 변수는 전역변수가 된다. 전역변수(global scope)는 애플리케이션 어디에서든 접근이 가능한 변수이다. var vscope = 'global'; function fscope(){ var vscope = 'local'; console.log('함수안 '+vscope); } fscope(); console.log('함수밖 '+vscope); //결과: 함수안 local 함수밖 global 지역변수의 유효범위는 함수 내부이다. var vscope = 'global'; function fscope(){ vscope = .. 2021. 12. 27.
Craousel 아이디어 1) 뼈대를 HTML로 작성 2) 화살표를 누르면 이미지 바뀌도록 JS 작성 2-1) button.addEventListner("click", function ButtonClick(){}) 를 사용해서 화살표를 누르면 다음 이미지로 넘어가도록 작성, 배열에 이미지를 넣어서 배열에 담긴 이미지를 순차적으로 보이도록 해보자. 2-2) 좌우 화살표와 아래 라디오버튼 동기화. -> 3-1)에서 선언한 $input 변수를 이용해서 $input[].checked = "checked";로 라디오버튼을 체크하였다. 3) 아래 버튼에 해당하는 상호작용 JS작성 3-1)버튼을 누를 때마다 배열의 인덱스를 재설정, JS의 number를 index로 지정. 정리할 것 Array() 생성자->배열 리터럴과 비교해서 정.. 2021. 12. 24.

티스토리툴바