티스토리 뷰
*0주 차 Pre-Onboarding B반 4조 언어 스터디
📌 자바스크립트 튜토리얼 하루에 한 페이지씩만 읽어보기 by 리액트 세션 임민영 튜터님
https://javascript.info/
📌 자바스크립트 문법 뽀개기
2022.10.24 - [⛵ 부트캠프, 항해99/JavaScript 문법 뽀개기] - JavaScript 문법 뽀개기
📗 [혼자 공부하는 자바스크립트] Ch 1
<body>
<script>
document.body.innerHTML = "<h1>안녕하세요</h1>"
</script>
</body>
※ innerText와는 달리 innerHTML은 element 안의 HTML이나 XML을 가져온다!
https://hianna.tistory.com/480
※ innerHTML : 문서 객체 생성
https://gangzzang.tistory.com/entry/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8JavaScript-%EB%AC%B8%EC%84%9C-%EA%B0%9D%EC%B2%B4-%EB%AA%A8%EB%8D%B8DOM-Document-Object-Model
- 72p 식별자 종류
구분 | 단독 사용 | 다른 식별자와 사용 |
식별자 뒤 괄호 없음 | 변수 | 속성 |
식별자 다 괄호 있음 | 함수 | 메소드 |
📗 [혼자 공부하는 자바스크립트] Ch 2
String
ㅇ 이스케이프 문자
\n 줄 바꿈 \t Tab \\ 역슬래시(\) 그 자체
console.log("".length)
//0
//빈 문자열도 문자열이다~
//" "하면 공백 인식해서 1 나옴
Boolean
=== 같다 !== 다르다 ! 서로 true ↔ false 바꿈
※ 연산자는 '피연산자'의 개수에 따라서 단항, 이항, 삼항 연산자로 구분한다.
자료형 검사
typeof(자료) 문자열과 비교해서 자료형 확인할 때 씀
console.log(typeof 10 === 'number')
//True
# 오답
console.log(2+2-2*2/2*2) //0
console.log(2-2+2/2*2+2) //4
나는 2*2 하고 2*2해서 4/4=1이라고 생각했는데, 2*2하고 4/2=2 그리고 2*2=4 이렇게 계산하는 것임!
나는 2*2하고 2/4 해서 1/2인 줄 알았는데, 2/2=1이고 1*2=2 이렇게 계산하는 것임!
Why? 왜 틀렸나?
수식에 우선순위가 같은 연산자가 여러 개 들어 있으면,
즉 곱하기 연산자와 나누기 연산자가 모두 들어 있으면
왼쪽에 있는 것이 오른쪽에 있는 것보다 먼저 계산됩니다.
이걸 몰랐음!
📌 후위 : 해당 문장을 실행한 후 값을 더하라!
alert(number++) 는 alert(number) 를 실행한 후 1 더함
let number = 10
console.log(number++) //10
console.log(++number) //12
console.log(number--) //12
console.log(--number) //10
✔ 증가 ++ 증감 -- 연산자는 상수에 적용할 수 없다!!
Why? 내부적으로 할당하므로 by 교재
그러면, 내부적으로 할당한다는 게 무슨 말일까?
a = b++ 라는 식이 있다면 b 가 1 증가되기 전의 값을 a 에게 넘겨주죠!
(b 의 초기값이 2 였다면 a 는 2 가 되고 b 는 3 이 될 것입니다.)
b++ 같은 후위증감연산자가 동작되는 원리는
1️⃣시스템 내부적으로 "임시 객체"가 만들어지고 이 곳에 1 증가되기 전의 기존 값을 복사해 할당합니다.
즉 b와는 별개인, b 가 1 증가되기 전의 값을 가진 "사본"이 만들어지는 것이죠.
그리고 기존 값을 가지고 있는 이 사본을 반환합니다.
2️⃣ 그리고 나서 원본인 b 를 1 증가시킵니다.이와 같은 원리로 진행이 됩니다.
즉, b가 원래 가지고 있던 값인 2가 어떤 임시 객체에 복사되고 이 임시 객체를 반환하게 되므로
이 임시 객체가 a 에 할당되는 셈입니다. 그래서 a 가 b 의 증가되기 전의 값을 할당 받게 되는 것이에요.
원본 b 는 1 증가되구요!
이와 달리 ++b 전위증감 연산자는 기존값을 사본으로 만들어 이를 반환하고 뭐 이런 과정 없이 그냥 원본을 바로 1 증가시켜버리고 이 원본을 리턴하기 때문에 여전히 원본 b 그 자체입니다.
https://nibble1492.tistory.com/7
< 자료형 변환 문제 >
ㅇ 내가 푼 방법
const dInput = prompt('달러 단위의 금액을 입력해주세요')
const d = Number(dInput)
const w = d*1207
document.write(`원화: ${w} 입니다`)
ㅁ 책 해설: 비어있는 output을 변수로 선언하고 달러, 원화 값을 할당함
let output = ' '
output += `달러 : ${dollar}\n`
output += `원화 : ${dollar*1207}`
alret(output)
→ 이 해설처럼 쓰면 뭐가 더 좋을까?
(내 생각엔) const 상수와 달리 let 변수로 선언하면 output 하나에 여러가지 값들을 할당할 수 있다.
so 여러 키워드를 정의할 필요도 없고, 결과값을 도출할 때 키워드 output 하나만 쓰면 된다.(구구절절 안적어도 됨)
😲 오늘 느낀 점
학원에서는 냅다 코딩부터 했는데 지금은 차근차근 개념을 기초부터 쌓는 느낌이다. 그런데 책만 보니 지루했다. 사람들과 얘기하며 바로 뭔가를 만들고 싶었다. 그렇지만 나는 아직 레벨 0.000001 쪼렙이므로 열심히 하겠다^^ 최소한 1인분의 몫은 할 수 있도록 노력하자! 👊🏻
👍 칭찬해
책 chapter 1부터 2까지 다 풀었음. TIL/WIL 특강 내용도 적었음. 오늘 TIL썼음. 운동도 했음.
⛵ 오늘 아쉬운 점 - 내일 일어나서 30분만 시간 내자!
입력 - prompt( ), confirm( ) / 변환 - Number( ) , String( ), Boolean( ) 함수들 감 잡기
'Edu_hanghae99 > TIL' 카테고리의 다른 글
[TIL] 📗 [혼공자] Ch5 함수_221112 (0) | 2022.11.13 |
---|---|
[TIL] 핵심 쏙쏙 Git 강의 1~3주차_221111 (2) | 2022.11.12 |
[TIL] 📗 [혼공자] Ch 4 반복문_221110 (2) | 2022.11.10 |
[TIL] 피그마 진짜 재밌다_221109 (0) | 2022.11.10 |
[TIL] 📗 [혼공자] Ch 3, 새 프로젝트 배포_221108 (0) | 2022.11.08 |