Spring

국비 코딩 Feb06 | 자바스크립트 기본정보, 연산자 정리, var선언, if문 단점

onnnzeoz 2023. 2. 6. 17:18

Java Script 

- 역할

프론트엔드인 html에 동적기능을 구현해줌

- 특징

html 문서 내의 객체를 다룰 수 있다

html 문서 내의 css 요소를 핸들링 할 수 있다

서버와 통신해서 얻은 respons를 동적으로 표현해줌 (Ajax 에이잭스)

자바스크립트 객체 형태의 데이터를 서버와 주고 받을 수 있다(Json)

자바스크립트를 이용한 라이브러리들이 계속적으로 나타나고 있다(node.js, jQuery, Electron)

- 적용 방법

html 문서 내에 따로 작성 (body태그 밑에서 실행)

js 파일을 외부에서 불러옴

 

변수

무언가 담는 컵각 컵을 구별하기 위해 변수에 이름을 붙임다양한 데이터가 담길 수 있음 (데이터 구분없이 다 담음)

 

연산자

피연산자를 연산자를 통해 계산하는 것피연산자 수에 따라 단항 연산자, 2항연산자, 3항연산자

 

단항연산자

ex) -1(부호 연산자), i++(증감 연산자), !true(논리부정 연산자)

 

2항연산자

ex) 덧셈, 뺄셈, 곱셈, 나눗셈, 나머지, 비교

 

**문자열끼리 더할 수 도 있음

 'A' + 'B' = AB 지만

여기서 A와 B가 피연산자, 2개니까 2항연산자

12+12+'A' = 숫자+숫자+문자 하면 오류날 수 있음! (이거 맞는지??)

 

비교 연산자

항상 왼쪽을 기준으로 비교 (ex A<B A가 B보다 작은지 검사)

동등비교(==, !=) 크기비교(>, >=, <, <=)

OR(||, |)과 AND(&&, &) 조건으로 결과 도출 가능

 

복합 대입 연산자

A%=10

 

3항연산자

항이 3개인 경우var score = 85;var grade = score > 90 ? 'A' : 'B' ; 

 


태그의 위치, 순서를 바꾸면 스타일이 깨져보일 수 있음

-> z-index활용 (얘를 높여줘서 앞에 있어야할 태그를 앞에 둠)

 

background-image와 background의 차이

-> backgroud-image는 좌표 지정이 안된다.

 
var를 안붙여도 선언은 된다, var를 붙인것과 안붙인 것의 차이는
var을 붙이면 그 스코프 내에서만 유효하고 var를 붙이지 않으면 전체에서 유효함
그래서 예를들어
fuction one(){
var x= "korea";
console.log('country : '+ x);
}
fuction two(){
x= 30;
console.log('age : ' + x);
}
console.log('dence : '+x);

 

이렇게 하면 결과 값은 dence : 30가 되는거

 

문자열 출력하는 법

console.log('int : '+int);

console.log('float : '+float);

,로 문자열과 변수를 출력하면 변수 안의 데이터 형태를 살려서 보여준다
ex) console.log('string : ', string);
       console.log('bool : ', bool);

 

변수에 그냥 x y 이런거 넣으면 안됨, 뜻을 알 수 있게끔 붙여야해

 

y++ 이런거는 어떤 액션을 한뒤에 카운트를 셀 때 자주 넣음

 

반전연산은 온오프가 연속적으로 일어나는 경우 유용

ex) var yn = true;

      console.log('YN : ',yn);

      yn = !yn;

      console.log('YN : ',yn);

      </script>

 

- %연산은 홀.짝 또는 배수 찾기에 자주 사용된다

 

- 결과를 일단 내고봐라, 과정이 깔끔한건 그렇게 중요치않음

 

- 문자열이 앞에 있으면 계산이 아니라 그냥 붙여버림(뒤에 뭐가 나오던 상관없이)

 

= 이꼴 하나는 대입해라~라는 뜻임

같다는 뜻은==이거임

 

if문 쓸 때 단점: 조건과 조건 사이에 틈새가 있을 경우 빠져나갈 수 있음