출처 : Let's Get IT 자바스크립트 프로그래밍 (도서)
제로초님 유튜브를 종종보긴 하는데 마침 자바스크립트 언어가 여전히 친숙하지 않아 도서관에서 책이 있어 대여를 하였다.
그냥 하자. 그러다 보면 할 수 있다고 믿어 의심치 않다! JS는 어느정도(..?) 1회독을 했기에 중요한 부분과 새롭게 안 사실들 그리고 프로그래밍을 기록하도록 하자.
24.08.20 ~
기본 문법
문자열 안에서 따옴표 사용하기
(백슬래시)가 붙은 따옴표는 보통의 문자로 해석된다. 이렇게 문자가 다르게 해석되게 하는 행위를 이스케이핑(escaping)이라고 하며, 따옴표를 이스케이핑한다고 표현한다.
문자열 여러 줄로 나타내기
\n 문자를 사용해도 되지만 백틱(`) 문자열이 편하다.
문자열을 숫자로 바꾸기
parseInt로 문자열을 숫자로 바꿀 수 있다.
parseInt는 문자열을 정수로만 바꾼다. 정수가 아닌 값을 입력하면 정수 부분만 추출해 표시한다. parseFlot을 사용하면 된다.
prompt()를 사용하면 직접 값을 입력할 수 있다. 값을 입력 후 에는 prompt()자리가 입력한 값으로 대체 된다.
Not a Number의 NaN은 자바스크립트에서 숫자라는 점을 기억하자.
무한 값 알아보기
무한 값끼리 계산할 때는 NaN이 나온느건, 무한에서 무한을 빼는 것은 성립하지 않는다는 뜻.
Infinity 값은 자주 쓰지는 않지만 무한이라는 개념을 프로그램에서 사용할 때 유용하다.
문자와 숫자 더하기
문자열과 다른 자료형을 더하면 다른 자료형이 문자열로 바뀐 후 문자열과 더해진다. 이처럼 값의 자료형이 바뀌는 현상 또는 바꾸는 행위를 형 변환(type casting)이라고 한다.
- 연산자를 사용할 때는 다른 자료형이 먼저 숫자로 형 변환된 후 빼기를 하게 된다. 문자열을 숫자로 바꾸면 NaN이 되고, 여기서 0을 빼도 그대로 NaN이므로 결괏값도 NaN이 나온다.
변수의 값 수정하기
let 변수명 = 식;
변수에 넣은 값을 비울 때도 있다. undefined을 대입하거나 null을 대입하는거다.
null을 대입해 값을 의도적으로 지웠다는 의미를 부여한다.
변수 활용하기
코드를 수정할 때는 string1 변수의 값만 수정하면 변수를 사용하는 부분이 한 번에 수정되어 모든 줄을 일일이 수정할 필요가 없다.
temp는 변수의 값을 서로 바꿀수 있는 코드이다.
상수 만들기
const는 상수(constant)의 줄임말이다. 우선 변수는 변하는 수이고, 상수는 변하지 않는 수이다.
선언한 상수도 다시 선언할 수 없으며, 한번 값을 대입하면 다른 값을 대입할 수 없다는 특성 때문에 상수 선언 시 초기화(선언과 동시에 값을 대입하는 것)하지 않으면 에러가 발생한다.
while 문과 for 문 비교
while 문에서 흩어져 있던 반복문 요소들을 for 문에는 모아서 표현한다고 이해하자.
eg 구구단을 출력하되, 결과에 짝수가 하나도 나오지 않게 continue 문을 사용해서 만들어보기
객체
객체(object)는 자료형의 일종으로 다양한 값을 모아 둔 또다른 값이며, 객체의 종류는 크게 배열(array), 함수(function), 배열이나 함수가 아닌 객체로 나눌수 있다.
참고로 const에 객체(배열, 함수, 객체 리터럴)가 대입되면 객체 내부의 속성이나 배열의 요소는 수정할 수 있다.
return
명시적으로 return문을 사용하지 않는다면 항상 함수 실행문 끝에 return undefined가 있다고 생각하면 된다.
아울러 함수의 실행을 중간에 멈추는 역할이 있다.
위 코드는 if문 자체가 false이기 때문에 return 문도 실행되지 않아 그 아래의 cosole.log()가 정상적으로 호출되는 것이다.
객체 리터럴
{}를 사용해 객체를 표현하는 것을 객체 리터럴이라고 한다. 
접근방법은 온점(.)을 통해 접근하거나, (변수.속성) 배열처럼 []를 사용해 (변수[속성])과 같이 접근할 수 있다. 다만 변수['속성'] 해야 한다.
참조와 복사
객체를 사용할 때 반드시 알아야 하는 개념이 바로 참조(reference)이다. 변수 a와 b가 같은 객체를 참조하고 있다고 표현하며, 또는 a와 b 그리고 객체 간에 참조 관계가 있다고 표현한다.
하지만 객체가 아닌 (문자열, 숫자, 불 값, null, undefined)는 조금 다르다.
객체가 안닌 값을 변수에 저장한 경우에는 참조 관계가 생긱지 않는다. 이렇게 참조가 생기지 않는 상황을 복사(copy)라고 한다. 복사는 어떤 값을 다른 변수에 대입할 때 기존 값과 참조 관계가 끊기는 것을 의미한다. 객체가 아닌 값은 애초부터 참조 관계가 없으므로 그냥 복사만 된다.
즉 객체는 참조하고 나머지는 복사한다라고 이해하자? 아마도,,,
여기서 조금만 더 들어가보자.
객체인 값을 복사하는 방법도 있는데 객체의 속성으로 또 다른 객체가 들어 있을 수도 있다는 점이다.
const array = [{j:'k'}, { i:'m'}];
array[0]; //{j: 'k'}
array[1]; //{l: 'm'} 위 코드에서 reference 변수를 선언해서 array 대입을하면 reference가 array를 참조하게된다.
const reference = array; // 참조
array === reference; //true
array[0] === reference[0]; //true따라서 객체를 복사할 때는 내부 객체까지 복사할 건지를 생각을 해봐야함.
여기서 나온 개념이 얕은 복사, 깊은 복사이다.
얕은 복사(shallow copy)는 외부 객체만 복사되고 내부 객체는 참조 관계를 유지하는 복사를 의미한다.
깊은 복사(deep copy)는 내부 객체까지 참조 관계가 끊기면서 복사되는 것을 의미한다.
얕은 복사를 할 때는 ...연산자를 이용한다. (스프레드 문법, spread syntax)
const array = [{j:'k'}, { i:'m'}];
const shallow = [...array]; // 얕은 복사
console.log(array === shallow); false
console.log(array[0] === shallow[o]); true깊은 복사에는 JSON.parse()와 JSON.stringify()라는 메서드를 사용한다.서로의 참조를 모두 끊어내는 것이 깊은 복사이다.
