🥬 상추의 공간

도입JavaScript에서 변수를 선언할 때 종종 마주치는 고민이 있다.'for문 내부에 변수를 선언해도 될까? 아니면 for문 밖에서 선언하는 것이 더 좋을까?' 이런 고민이 생긴 이유는 let과 const는 var과 달리 재선언이 불가능하기 때문이다.또한 'for문 내부에서 변수를 선언하면 반복이 될 때마다 선언되니 메모리적으로 비효율적이지 않을까? 혹시 문제가 발생하지 않을까?'라는 생각도 들었다(아래 코드의 2번 방식). 하지만 실제로 사용해보면 아무런 문제가 발생하지 않는다. 그래서 그냥 넘어갔던 문제인데, 이러한 고민이 들 때마다 찝찝한 마음이 들어서 이번 기회에 확실히 정리하고자 한다. // 1. for 문 밖에서 변수를 미리 선언하고 재할당하는 방식let ny, nx;for (let i =..

데이터 타입의 필요성1. 데이터 타입에 의한 메모리 공간의 확보와 참조값은 메모리에 저장하고 참조할 수 있어야 한다. 메모리에 값을 저장하려면 먼저 확보해야 할 메모리 공간의 크기(메모리 셀의 개수(byte 수))를 알고 결정해야 한다. js엔진은 데이터 타입(값의 종류)에 따라 정해진 크기의 메모리 공간을 확보한다 확보되는 메모리 공간의 크기는 js 엔진 제조사에 의해 다를 수 있다. ECMAScript에는 숫자 타입은 배정밀도 64bit(8byte) 부동소수점 형식을 사용하다고 명시되어 있다.var score = 100;위 예제에서 js 엔진은 리터럴 100을 숫자 타입의 값으로 해석하고 이를 저장하기 위해 8byte의 메모리 공간을 확보한 뒤 2진수로 저장한다.💡 심벌 테이블컴파일러 또는 인터프리..

데이터 타입데이터 타입은 값의 종류를 말한다. javascript에서 원시 타입은 7개이며, 그 외에는 모두 객체 타입이다. javascript는 객체 기반 언어이므로 거의 모든 것이 객체로 이루어져 있다. 이번 장에서는 원시 타입에 대해 다루고, 객체 타입은 추후 다루고자 한다. js 엔진은 타입을 구별해서 값을 취급한다. 따라서 값이 같더라도 타입에 따라 해석하는 방식이 다르다.ex) 0100 0001 - 숫자로 해석하면 65, 문자로 해석하면 ‘A’ 원시 타입 1 - 숫자 타입(number)C나 java의 경우, 정수와 실수를 구분해서 int, long, float 등 다양한 숫자 타입을 제공한다. 하지만 javascript에서 숫자는 실수 타입만 존재한다. 정수로 표기해도 사실은 실수다.// 숫자..

메모리변수에 대해 알기 전, 먼저 메모리에 대해 간단히 짚고 넘어가겠다.컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리는 데이터를 저장할 수 있는 메모리 셀의 집합체다. 메모리 셀 하나는 1Byte이며, 컴퓨터는 메모리 셀 단위로 데이터를 저장하거나 읽어들인다. 각 셀은 고유의 메모리 주소를 갖는다.컴퓨터는 모든 데이터를 2진수로 처리한다(위 그림은 편의상 10진수로 표기했다). 숫자 값 10, 20은 임의의 메모리 주소에 저장되고 CPU는 이 값을 읽어 들여 연산을 수행한다. 연산 결과인 30도 메모리의 임의의 주소에 저장된다. 자, 이제 연산이 끝났고 나는 연산 결과인 숫자 30을 이용해 어떠한 작업을 하고 싶다.하지만, 연산 결과가 메모리에 저장되었지만 재사용을 할 수..

호출과 선언 명확히 구분할 줄 알아야 하고, 아래 코드를 실행 하기 전에 어떤 결과가 나오는 지 알 수 있어야 한다.const x = "x";function c() { // 선언 const y = "y"; console.log("c"); // 호출 // debugger; // 호출 스택 보는 법}function a() { // 선언 const x = "x"; console.log("a"); // 호출 function b() { // 선언 const z = "z"; console.log("b"); // 호출 c(); // 호출 } b(); // 호출}a(); // 호출 - a, b, cc(); // 호출 - c호출 스택은 호출할 때만 쓰이는 스택이다.함수를 호출할 때마다 스택이 밑에서부터 쌓이..

함수 선언 방법 중에는 다음과 같이 화살표 함수 방식이 있다.중괄호를 생략하면 return이 포함되어 있다.주의해야 할 점은, 객체를 return할 때는 꼭 소괄호로 감싸줘야 한다. js 엔진은 중괄호를 return이 아닌 함수의 몸체로 보기 때문이다.// 아래 세 개는 같은 표현const add = (a,b) => { return a + b };const add = (a,b) => a+b;const add = (a,b) => (a+b);// 객체를 리턴할 땐 꼭 소괄호로 감싸줘야 함const add = (a,b) => ({a + b}) 함수를 호출할 때, 매개변수에 함수를 넣는다면 주의해야 할 점이 있다. 함수이름 뒤에 () 를 붙으면 함수 호출이 된다는 것이다.const add = (a,b) =>..

중복(반복)이 있으면 제거하자. 하지만 모든 반복을 제거할 수 없을 수 있으므로 최대한 줄이도록 해보자.이번 시간에는 고차함수를 통해 중복을 제거하는 방법을 알아볼 것이다.고차함수란?const func = () => { return () => { console.log("hello"); };};const innerFunc = func(); // func의 return 값innerFunc(); // hello여기서 innerFunc는 아래 코드와 같다.func()의 리턴값이기 때문이다.const innerFunc = () => { console.log("hello");}함수가 호출된 코드(함수 이름 뒤에 ()가 붙은 코드)가 있다면 그 부분을 실제 return 값으로 치환하면 이해하기 쉽다.c..

순서도순서를 넘기는 경우 아래와 같은 순서를 거쳐야한다.코드 1번째 참가자 제시어: 입력  개념 정리대화상자 띄우기- promt : 대화 상자에 사용자가 입력한 메시지가 문자열 형태로 전달되고, 입력하지 않고 취소를 누르면 null이 전달된다.- alert : 단순 알림창. 호출하면 확인을 누르기 전까지 다음 스크립트 실행이 중단된다.- confirm : 사용자에게 확인을 받을 때 사용. 확인을 누르면 true, 취소를 누르면 false를 전달한다. HTML 태그 선택하기document.querySelector("선택자");document.querySelectorAll("선택자");document.querySelector("#아이디");document.queryS..