1차 공부/TIL

221112 객체(6장)

공대탈출 2022. 11. 12. 22:10

01234567891011121314
01


57페이지. 오늘 읽고 쓰고 이해해야 할 범위였다.

어제는 쓰는데 사용되는, 볼펜과 마주하는 근육만 눌림에 의해 고통스러웠다면

오늘은 손목까지 아팠다...

장시간 공책에 쓰다보니 필기자세가 점점 편한 자세를 찾을 수 밖에 없고, 그러다보니 손목에 무리가 가는 것 같다.

또, 하루종일 의자에 앉아 구부정한 자세로 책상만 보니 허리도 목도 아프다...

어제와 마찬가지로 til은 공책으로 대신하고, 틀린문제, 헷갈리던것, 알아야 할 것을 쓰고 마무리를 하려고 한다.

아직 0주찬데 벌써부터 이러면.... 걱정이다.


알아야 할 것

사실 객체는 전부 알아야 할 거라고 생각하는데, 너무 그 양이 많다보니 헷갈렸던 것과 중요하게 생각했던 것만 적도록 한다.

 

객체에 속성 추가

객체[속성] = 값  //////// 객체.속성 = 값

 

객체에 속성 제거

delete 객체.속성 /////// delete 객체[속성]

 

제곱연산자

**  :  수학에서의 ^를 의미한다.

ex) 2**2 = 2^(2)

 

배열 내 어떤 자료가 있는지 확인

.indexOf()

 

const j = '안녕하세요' j.indexOf('안녕')

 

NaN은 === 연산자로 비교가 불가하다.

 

Infinity는 === 연산자로 비교가 가능하다.

 

외부 스크립트 파일 읽어들이기

//test.js
console.log('#test.js파일')
const sample = 10
//main.html
<!DOCTYPE html>
<html lang="en">
<head>
	<script scr = "test.js"></script>
    <script>
        console.log('# main.html의 script태그')
        console.log('sample 값:', sample)
    </script>
</head>
<body>
    
</body>
</html>

코드 순서대로 test.js파일의 console.log가 출력 되고 sample 상수가 입력된다.

그 후 main.html의 console.log가 출력되고 두번째 sample값을 출력하는 console.log가 출력된다.

 

 

(불문) ? 참일때 실행 : 거짓일때 실행

 

배열, 객체 둘다 얕은 복사와 깊은 복사가 나뉘어져있다.

얕은 복사는 const를 이용하여 새로운 배열 혹은 객체에 원래 배열 혹은 객체를 입력하는 것이다.

이때 새로 입력된 값이 있다면 원래의 배열 혹은 객체에도 영향을 끼친다.

 

깊은 복사는 const를 이용하고, ...을 사용하여 전개형식으로 배열 혹은 객체를 복사해온다.

이때 변경, 추가, 삭제 등 요소나 속성을 변경하면 새로이 선언된 배열 혹은 객체에만 영향을 주고, 원본에는 영향을 주지 않는다.

 


질문했던 것

객체에서의 화살표 함수와 this

<!DOCTYPE html>
<html lang="en">
<head>
    <script>
        const test = {
        	a: function () {
            	console.log(this)
			},
            b: () => {
            	console.log(this)
			}
		}
        test.a()
        test.b()
    </script>
</head>
<body>
    
</body>
</html>

 여기서 익명함수로 처리된 a는 객체에 스코프되어 섀도잉된다.

따라서 여기서 this값은 test객체의 속성인 a : f 와 b :  f 를 출력한다.

 

그러나 화살표 함수로 선언된 b는 객체에 스코프되지않아 섀도잉이 되지않는다.

따라서 여기서 this값은 웹브라우저 자체의 객체를 출력한다. 여기서 this는 window객체이다.

 


틀렸던 문제

    <script>
    	const degree = 90
        
        //Math.sin을 이용하여 사인90도 값을 구해 출력하라
        작성구간
    </script>

이번엔 모질라 문서에서 직접 Math객체의 내용을 읽고 sin과 관련된 코드를 작성하는 것 이었다.

처음에는 검색하고 대충 읽어서 이런 코드를 작성했다.

    <script>
        const degree = 90
        console.log(Math.sin(degree))
    </script>

그런데 결과가 0.8939966636005579가 나왔다. 나와야 하는 결과는 1인데 말이다.

그래서 어떤 것이 잘못된 것인지 알기 위해 공식문서에 적힌 내용을 보았다.

내가 입력한 90은 단위가 도인데 공식문서에서 x에 입력하는 단위는 라디안이었다.

그리하여 도로 이루어진 상수를 라디안으로 바꾸어 다른 상수에 선언하고, 그 상수를 사용하여 사인함수를 출력하는 코드를 작성하였다.

    <script>
        const degree = 90
        const rad = Math.PI*degree/180
        console.log(Math.sin(rad))
    </script>

라디안 = pi*각도/180이므로 자바스크립트에서 pi값인 Math.PI를 공식문서에서 찾아 사용하였다.

 

결과는 1이 정상적으로 출력되었다.

 

단순하다 생각한 문제였지만 함정이 숨어있었다.

그런데 그건 문제가 원하는 순서였던것 같다.

주어진 90도를 입력해서 틀린 값이 나오고, 공식문서를 찾아보며 정확한 사용방법을 알아낸 뒤

그 사용방법에 알맞은 코드를 작성하는 것을 알려주려 했던 것 같다.

 

공식문서를 보는 방법, 그리고 자세히 읽어 확실한 사용방법으로 코드를 작성하는 실력을 키워야겠다.

'1차 공부 > TIL' 카테고리의 다른 글

221121 til  (0) 2022.11.21
221118 til  (0) 2022.11.18
221111 함수 (5장)  (2) 2022.11.11
221110 반복문(4장)  (0) 2022.11.10
221108 조건문(3장)  (0) 2022.11.08