분류 전체보기 157

call by value란?

자바스크립트에서 call by value란 변수나 객체 등이 함수의 인자(argument)로 들어와 매개변수(parameter)로 전달될 때 어떤 방식으로 전달될지를 결정하는 방식이다. 크게 두가지 방식이 있다고 한다. Call by value(값에 의한 호출, 값의 복사) Call by reference(참조에 의한 호출, 주소의 복사) 일반적으로 기본형(원시형)을 매개변수로 넘길 때는 Call by value 방식으로 넘기고 참조형을 매개변수로 넘길 때는 Call by reference 방식으로 넘긴다. 기본형(원시형) : 숫자, 문자열, 불리언, null, undefiend, 심벌 참조형 : 객체, 배열, 함수, 날짜, 정규표현식 Call by value(값에 의한 호출, 값의 복사) Call by..

javascript 2022.12.01

유사배열

자바스크립트에서 유사 배열은 배열과 비슷해 보이지만 그 차이는 분명하다. 해당과 같이 document.querySelectorAll()로 가져온 태그들은 NodeList라는 형태로 유사 배열 형태를 갖게 된다. 그럼 한 가지 실험을 해보겠다. 이 NodeList 또한 배열처럼 for문을 통해 해당 배열을 요소들을 확인할 수 있는데 그때 해당 요소의 값의 변경을 시도해보겠다. arr이라는 배열의 Number타입의 숫자 요소 값들이 들어가 있어 for문을 돌면서 해당 요소 값을 변경을 시도 시 arr배열의 요소들은 모두 문자열로 변경되었다. 하지만 NodeList의 요소들은 문자열로 변경되지 않았다! 이것의 첫 번째 배열과 유사 배열의 차이점이다. 두 번째로는 배열은 배열 메서드를 사용할 수 있지만 유사 배..

javascript 2022.12.01

항해 21일차 WIL

항해 21일 차 이번 주도 거의 백 투 더 퓨처 느낌으로 타임머신을 탄 기분이었다. 시간 개념은 사라진지 오래고, 오늘이 며칠인지 오늘 점심에 알았다.. 이번 주는 자바스크립트 알고리즘 문제를 풀면서 정말 한 문제 한 문제가 산 넘어 산이었던 것 같다. 또 React주특기 팀이 새로 만들어지고 React를 사용해 보았는데 너무 재미있어서 시간 가는 줄 몰랐던 것 같다. 이번 주차 과제로 ES에 대해 알아보았다. 자바스크립트는 1990년대 Netscape 회사의 Brendan Eich 라는 사람에 의해 최초 개발되었으며, 자바스크립트가 잘 되자, MS에서 Jscript라는 언어를 개발해 IE에 탑재하였는데, 이 두 스크립트가 너무 제가 각이라, 표준이 필요하게 되었다고 한다. 표준을 위해 자바스크립트를 E..

항해99 2022.11.27

var 와 let 과 const 블록레벨 스코프

위 사진에서 var키워드로 선언한 x 변수와 y 변수는 중복 선언되었다. 이처럼 var 키워드로 선언한 변수를 중복 선언하면 초기화문(변수 선언과 동시에 초기값을 할당하는 문) 유무에 따라 다르게 동작한다. 초기 화문이 있는 변수 선언문은 자바스크립트 엔진의 의해 var 키워드가 없는 것처럼 동작하고 초기화문이 없는 변수 선언문은 무시된다. 이때 에러는 발생하지 않는다. var 키워드로 변수를 선언하면 변수 호이스팅에 의해 변수 선언문이 스코프의 선두로 끌어올려진 것처럼 동작한다. 즉, 변수 호이스팅에 의해 var키워드로 선언한 변수는 변수 선언문 이전에 참조할 수 없다. 할당 문 이전에 변수를 참조하려면 undefined가 반환된다. let 키워드 let키워드로 이름이 같은 변수를 중복 선언하면 syn..

javascript 2022.11.26

스코프

자바스크립트에서의 스코프는(유효 범위) 뜻대로 변수에 접근 가능한 어떤 범위를 말하는 것 같았다. 스코프는 자바스크립트를 포함한 모드 프로그래밍 언어의 기본이며 중요한 개념이라고 한다. var 키워드로 선언한 변수와 let또는 const 키워드로 선언한 변수의 스코프도 다르게 동작한다. 스코프는 변수 그리고 함수와 깊은 관련이 있다고 한다. 함수의 매개변수는 함수 몸체 내부에서만 참조할 수 있고 함수 몸체 외부에서는 참조할 수 없다고 했다. 이것은 매개변수를 참조할 수 있는 유효범위, 매개변수의 스코프가 함수 몸체 내부로 한정되기 때문이다. 변수는 자신이 선언되 위치에 의해 자신이 유효한 범위, 즉 다른 코드가 변수 자신을 참조할 수 있는 범위가 결정된다. 변수뿐만 아니라 모든 식별자가 그렇다. 모든 식..

javascript 2022.11.26

항해 14일 WIL

항해 14일 차 벌써 14일이라는 시간이 흘렀다니... 믿기지 않는다 이번 주차에서는 4 일동안 무작정 웹페이지를 개발해서 배포까지 해보는 시간을 가졌다. 우리조는 큰 문제없이 배포까지 즐겁게 개발했던 것 같다. 무엇보다도 팀으로 움직이고 얘기하다 보니 정말 재미있었고 3일이라는 시간이 너무나 빨리 가서 아쉬웠다. 이번 웹페이지에 개발의 주된 목표는 JWT 로그인 구현과, API 통신, Git 협업이 주된 목표였던 것 같다. 나는 조에서 JWT로그인 부분은 맡지는 않았지만 로그아웃 기능을 맡았었는데 전에 JWT에 관심이 많아 영상과 자료를 몇번 찾아보면서 공부를 했었지만 스스로 구현은 못했었다. 이번에 항해에서 준 JWT 예제로 JWT가 어떻게 사용되는지 알 수 있었고 (encode, decode 방식 ..

항해99 2022.11.20

프로퍼티와 메서드

이번 글에서는 객체를 생성할 때 불리는 프로퍼티와 메서드에 대해 공부해 보았다. 프로퍼티? 프로퍼티란 객체의 상태를 나타내는 값으로 객체는 프로퍼티의 집합이며, 프로퍼티는 키와 값으로 구성된다. 프로퍼티를 나열할 때는 쉼표(,)로 구분한다. 일반적으로 마지막 프로퍼티 뒤에는 쉼표를 사용하지 않으나 사용해도 좋다. 프로퍼티 키 : 키 문자열을 포함하는 모든 문자열을 또는 심벌 값 프로퍼티 값 : 자바스크립트에서 사용할 수 있는 모든 값 프로퍼티 키는 프로퍼티 값에 접근할 수 있는 이름으로서 식별자 역할을 한다. 하지만 반드시 식별자 네이밍 규칙을 따라야 하는 것은 아니다 단, 식별자 네이밍 규칙을 준수하는 프로퍼티 키와 그렇지 않은 프로퍼티 키는 미묘한 차이가 있다. 심벌 값도 프로퍼티 키로 사용할 수 ..

javascript 2022.11.20

객체

필자는 자바스크립트에서의 객체는 자바스크립트 그 자체라고도 생각할 정도로 중요하다고 생각한다. 객체는 함수와도 밀접한 관계를 갖고 있으며 그렇기 때문에 객체를 알아야 함수를 알 수 있고, 함수를 알아야 객체도 알 수 있다고 생각한다. 객체 객체는 프로퍼티의 개수가 정해져 있지 않으며, 동적으로 추가되고 삭제시킬 수 있다. 또한 프로퍼티 값의 제약도 없다. 따라서 객체는 원시 값과 같이 확보해야 할 메모리 공간의 크기를 사전에 정해 둘 수 없다. 객체는 복합적인 자료구조 이므로 객체를 관리하는 방식이 원시 값과 비교해서 복잡하고 구현 방식도 브라우저 제조사마다 다를 수 있다. 원시 값은 상대적으로 적은 메모리를 소비하지만 객체는 경우에 따라 크기가 매우 클 수도 있다. 객체를 생성하고 프로퍼티에 접근하는 ..

javascript 2022.11.20

재귀함수, 중첩함수, 콜백함수

이번 글에서는 함수를 잘 사용하는 방법에 대해 또 함수를 어떻게 활용해야 하는지에 대해 공부해보았다. 이번 글은 필자의 글에 있는 함수 리터럴이라는 제목의 글을 보고 온다면 함수에 대해 더 잘 이해할 수 있으니 보고 오는 것을 권장한다. 재귀 함수 함수는 자기 자신을 호출하는 것을 재귀 호출이라 한다. 재귀 함수는 자기 자신을 호출하는 행위, 즉 재귀 호출을 수행하는 함수를 말한다. 위의 함수는 문제없이 잘 동작한다. 하지만 반복문이 없어도 구현할 수 있는 방법이 있다. 그 방법이 바로 재귀 함수이다. 위에 보이는 countdow2 함수는 countdown1 함수처럼 동작한다. 재귀 함수를 사용하여 반복되는 처리를 반복문 없이 구현을 할 수 있기 때문이다. 위에 보이는 함수는 factorial이라는 함수..

javascript 2022.11.20

TDZ 와 호이스팅(Hoisting)

호이스팅은 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미하며. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다. 반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다. 호이스팅을 설명할 땐 주로 "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는" 것으로 말하곤 한다. 따라서 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장할 수 있으며 선언과 초기화를 함께 수행하는 경우, 선언 코드까지 실행해야 변수가 초기화된 상태가 된다 TDZ는 Temporal Dead Zone의 약자로 일시적인 사각지대란 뜻을 가진다. 일시적인 사각지대는 스코프의 시작 지점부터 초기화 시작 지점까지의 구간을 TDZ라고..

javascript 2022.11.18