오늘은 웹개발 이런거 다 잊어버리고 정말 순수하게, Javascript를 공부하는 날!
오늘 안에 JS의 기본 개념을 찢어버리려고 했는데
참 유연한 JS는 자꾸 궁금증을 불러일으키고 마는데.....
01. var, let, const 의 차이?
👉🏻 var, let, const 도대체 명확한 차이점이 뭐야?
var는 ES6 전에 쓰이던 변수선언방식이라고 생각했고,
let은 변할 수 있는 것, const는 변하면 안되는 것이라고 생각했다 (단순무식)
근데 사실 제대로 써본 적은 없어.. 그래서 공부해보기로 함!
엘리가 아직도 var를 쓰는 FE개발자가 있다면 등짝 때려주라고 했었기때문에 var 이야기는 넘어간다.
(JS의 치명적인 단점인 유연함을 그대로 나타내는 특징 중 하나라고 생각해서 더 넘어간다 ㅎ )
let, const의 공통점 - " 변수 재선언 불가능 "이라고 한다.
이미 선언된 변수명으로는 다시 변수를 생성할 수 없다.
그렇다면 차이점은 무엇일까? 바로 immutable ! " 재할당 가능 "
let은 name이라는 변수에 재할당이 가능하다.
하지만 const는 재할당을 할 수 없는 것!
이렇게 재할당을 하려고 하면 에러가 난다.
유일무이한 변수를 선언하려고 하는 경우에만 const를 사용하면 되는거 아닌가? 라고 생각했는데
변수를 재할당해서 사용하는 것은 위험한 방식이라고 한다. so.....
- 재할당이 필요한 경우에 한정해
let을 사용한다. 이때, 변수의 스코프는 최대한 좁게 만든다.- 재할당이 필요 없는 상수와 객체에는
const를 사용한다.
그리고 오늘, 급 궁금해진 것 👇🏻
02. spread 연산자
String 데이터 타입의 lastName이라는 변수에 함수를 적용해도
lastName변수의 원래 상태는 변하지 않는다.
하지만 array 데이터 타입의 a라는 변수는
b 변수에 재할당을 하기 위해 가공하는 순간 원래 상태가 변하게 된다.
😱
array라는 변수를 두고 생각해보면, 변할 수 있는 것 & 없는 것의 기준이 참 이상하다.
내가 변수를 가지고 조작하는 순간, 그 변수의 값이 변해버리는데
난 array가 변하는걸 원하지 않아. 그럼 어떻게 해야 안변할 수 있어..?
혹시나 해서 새로운 변수에 담아보고, 변수 선언을 let, const를 섞어서 해보고 난리를 쳤지만
일단 그 변수를 가지고 조작하는 순간 값이 변한다.
알고보니, reverse()함수의 정의는 요로케 되었던 것
🌟
reverse()
함수를 호출한 배열을 거꾸로 뒤집고, 그 배열을 가리키는 참조값을 반환합니다.
따라서, 이 함수를 실행시키면 원본 배열이 변형됩니다.
👆🏻 그 해결책으로 제안받은게 바로 spread 연산자!
🌟
[...arr].reverse()
배열을 복사하기 위해서 spread operator(전개 연산자)를 사용합니다.
...이 바로 spread operator(전개 연산자)입니다.
spread operator(전개연산자)는 배열이나 객체에서 element들을 꺼내어, 복사해줍니다.
단순히 배열을 통으로 추가하고싶을 때에만 사용한다고 생각했는데,
이렇게도 사용할 수 있었다니 정말 놀랍구나 스프레드야 🤩
03. 데이터타입 String + Number 가능?
서로 다른 type인 String + Number를 시도할 때 주의할 것!
- String과 Number형을 더하면 항상 String 형으로 변환
- 다른 프로그래밍 언어에서는 서로 다른 type인 String과 Number는 서로 더하거나 뺄 수 없지만
우리의 유연한 JavaScript는 오류를 내지 않고 더하게 된다.
04. 배열을 거꾸로 뒤집는 3가지 방법
spread 연산자를 사용하면 된다고 생각하고 더이상 생각하지 않으려했는데,
그래도 궁금하다. 어떻게 뒤집는 방법들이 있는지..!!!
- for 반복문 사용
- reverse() 함수
- reverse() 함수 - 원본 배열 유지하기
