국비 TIL(Today I Learned) 20220512 JS변수, 타입, 조건문

자바스크립트의 설명, 특징들 중에

"angular, react, vue, polymer 등 다양한 라이브러리들을 지원하고 있고..."

polymer라는 건 처음 들어봄, 지금은 사용 안하나봄

https://d2.naver.com/helloworld/3259111

위의 글은 18년도 글임, 그 때 당시에도 polymer를 잘 모른다는 비율이 높네

 

 

https://developer.mozilla.org/ko/docs/Web/Security/Same-origin_policy

동일 출처 정책 - 웹 보안 | MDN

동일 출처 정책(same-origin policy)은 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한

중요한 보안 방식!

 

 

- 비동기 입출력을 이용한 서버를 작성할 수 있다  -> node.js 래

 

 

* "", '', `` 다 사용가능

*변수

https://velog.io/@exploit017/JS-%EC%84%B8%EB%AF%B8%EC%BD%9C%EB%A1%A0-%EC%9E%90%EB%8F%99-%EC%82%BD%EC%9E%85ASI

[JS] 세미콜론 자동 삽입(ASI)

람다.... 들어봤는데, 뭐지는 모름

아? 람다식이 화살표 함수 얘기하는거였어??

https://progl.tistory.com/4

자바스크립트 화살표 함수 (람다식)

https://devkingdom.tistory.com/307

[JS] javascript의 화살표 함수 (arrow function)

 

node.js 수업강의에 있는지 없는지 모르겠지만, 꼭 배워야한데, 시간 남으면 살짝 해주신데, 장담못한데 시간 남으면

 

컴파일 언어와 인터프리터 언어의 차이점

컴파일 언어는 전체 코드를 번역한 후 오류가 없으면 실행 가능하다 (자바, C)

인터프리터 언어는 한줄 읽어서 문제가 없으면 바로 실행, 다음중에 오류가 있던 없던 상관하지 않는다.

보통 인터프리터 언어는 변수를 사용하기 전에 미리 선언할 필요가 없다. 대표적으로 자바스크립느, 파이썬

 

이게 좋은거 같지만 코드가 길어지면 변수를 선언하지 않고 썼을 경우 단순 오타에 의해서도 결과가 달라지므로 문제가 심각해진다. 그래서 자바스크립트도 변수를 선언하자 라고 해서 만든 문법이 엄격모드이다.

https://beomy.tistory.com/13

[자바스크립트] 엄격 모드(strict mode)

 

변수 선언과 사용 예,

변수명 규칙(카멜케이스, 스네이크케이스)

변수와 상수

 

타입: 숫자형, 문자형, 불린형, null, undefined

숫자형

•NaN은 계산 중에 에러가 발생했다는 것을 나타내주는 값입니다. 부정확하거나 정의되지 않은 수학 연산을 사용하면 계산 중에 에러가 발생하는데, 이때 NaN이 반환됩니다.

•자바스크립트에서 행해지는 수학 연산은 '안전’하다고 볼 수 있습니다. 0으로 나눈다거나 숫자가 아닌 문자열을 숫자로 취급하는 등의 이례적인 연산이 자바스크립트에선 가능합니다.

•말이 안 되는 수학 연산을 하더라도 스크립트는 치명적인 에러를 내뿜으며 죽지 않습니다. NaN을 반환하며 연산이 종료될 뿐입니다.

 

문자형

https://wakestand.tistory.com/152

파이썬 문자와 숫자 합쳐 출력하는 방법

파이썬은 형 변환을 해줘야함

numberVariable = 10 // 숫자 변수

print(str(numberVariable) + "입니다") 문자로 변환해서 합치기

 

불린형

==, === 차이!

null

 

•자바스크립트의 null은 자바스크립트 이외 언어의 null과 성격이 다릅니다. 다른 언어에선 null을 '존재하지 않는 객체에 대한 참조’나 '널 포인터(null pointer)'를 나타낼 때 사용합니다.

•하지만 자바스크립트에선 null을 ‘존재하지 않는(nothing)’ 값, ‘비어 있는(empty)’ 값, ‘알 수 없는(unknown)’ 값을 나타내는 데 사용합니다.

•let age = null;은 나이(age)를 알 수 없거나 그 값이 비어있음을 보여줍니다.

 

undefined

 

•undefined는 '값이 할당되지 않은 상태’를 나타낼 때 사용합니다.

•변수는 선언했지만, 값을 할당하지 않았다면 해당 변수에 undefined가 자동으로 할당됩니다.

•undefined를 직접 할당하는 걸 권장하진 않습니다. 변수가 ‘비어있거나’ ‘알 수 없는’ 상태라는 걸 나타내려면 null을 사용하는게 좋습니다

 

 

프롬포트(요즘 많이 안씀)

var x= prompt("x값은?") // 취소버튼을 누르면 null 값이 온다.

    if( x !== null){

        console.log(x);

    } else{

        console.log("값이 입력되지 않았습니다.");  

    }

만약에 연산자 *로 하면은 숫자로 인식하고 곱하기 됨, +는 안됨

 

function 만들기

ava = total/ 3으로 알려주셨는데, 3으로 하드코딩 되는게 싫어서 배열로 만들어버림, 이것도 하드코딩 같지만

total += arr; 이거는 왜 안될까 object HTMLInputElement]10,20,30 이렇게 나옴

 

 

 

논리연산자

 

document.getElementById("name").value;는 왜 전역변수가 되지 않는가!!!!

그래서 아래처럼 바꿨는데, 아래는 전역변수 되고, 미리 입력받아진 데이터가 없어서 그런건가

 

그런가보다 페이지 로드마되자마 실행되는데 그 시점에 value값이 없음

계산하기 직전에 읽어서 계산하면 된다는데, 이것저것 해보고 있는데 아직 안됨, 좀더 방법을 찾아보겠어

 

윤년 구하기

 

스타일 변경하기, 색깔 변경

random 색깔은 내가 해봄 var randomColor = "#" + Math.round(Math.random()* 0xffffff).toString(16);

function 매개변수 인자로 받기

 

 

if문 과제 하나 코딩 해보라고 하시고는 끝! 그거는 내일 쓰겠어