Javascript에서의 연산자부터 알아보자!
| 연산자 | 종류 |
| 산술연산자 | + - * / % |
| 증감연산자 | ++ -- |
| 대입연산자 | = += -= /= %= |
| 비교연산자 | == != (동등연산자) === !== (일치연산자) > >= < <= |
| 논리연산자 | && || ! |
| 조건연산자 | 조건 ? 실행문1 : 실행문2 |
자바와 거의 비슷하지만 차이점이 있다
바로 동등연산자와 일치연산자 두가지가 있다는 것~~
동등연산자는 자료형이 달라도 자동으로 변환시켜서 비교하지만 일치연산자는 자료형이 일치하는지까지 구분한다!
예시!
10 == '10' -> true 자료형 상관x
10 === '10' -> false 자료형 상관o
연산자 실습!
변수 num 값 중에서 백의 자리 이하를 버리는 코드이다.
만일 변수 num의 값이 456이라면 400이 되고, 111이라면 100이 된다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let num=312
console.log("백의 자리 이하 버린 결과>>" + (num-(num%100)))
</script>
</body>
</html>num이 312일때 100으로 나눈 나머지값은 12이고 312에서 12를 빼면 312에서 100의자리 이하는 버린 결과를 얻을수있음!
실행화면
형변환 함수
| 함수 | 종류 |
| parseInt() | 문자열 변수를 숫자(정수)로 변경 |
| parseFloat() | 문자열 변수를 숫자(실수)로 변경 |
| Number() | 다른 자료형을 숫자형(정수&실수)으로 변환 |
| toString() | 숫자를 문자열로 변경 |
조건문 특이점
- 조건식에 0 이외의 데이터를 넣어준다면 true로 인식한다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let num=5
// 아무 변수나 넣었는데도 실행됨!
if(num){
console.log("333")
}
</script>
</body>
</html>
잘 실행되는 것을 볼 수 있다~~
조건문과 형변환 함수를 동시에 사용하는 실습!
Java,Android, Web 점수를 입력하여 평균과 학점을 출력하세요.
( 90점 이상 = A / 80점 이상 = B / 70점 이상 = C / 이외 = F )
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let java = Number(prompt("Java점수를 입력해주세요","여기에"))
let and = Number(prompt("Android 점수를 입력해주세요","여기에"))
let web = Number(prompt("Web 점수를 입력해주세요","여기에"))
// 나눗셈을 했을때 소수점이 아닌 정수형으로 나오도록 parseInt 사용
let agv = parseInt((java+web+and)/3)
let score = "F"
// 연산을 하기 위해서 Number 사용
if(Number((java+and+web)/3)>=90){
score = "A"
}else if(Number((java+and+web)/3)>=80){
score="B"
}else if(Number((java+and+web)/3)>=70){
score="C"
}
console.log("당신의 평균은 " + agv + " 점이고 " + score + " 입니다.")
</script>
</body>
</html>
실행 화면
조건문 예제2
빨강, 초록, 파랑 중에 원하는 색을 입력했을 때, 웹 브라우저
배경색이 바뀌도록 작성하세요
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
color = prompt("색깔을 적어주세요(빨강, 초록, 파랑)")
if(color=="빨강"){
document.querySelector("body").style.backgroundColor="red";
}
else if(color=="초록"){
document.querySelector("body").style.backgroundColor="green";
}
else if(color=="파랑"){
document.querySelector("body").style.backgroundColor="blue";
}
</script>
</body>
</html>
실행화면
'웹 개발 언어 > JavaScript' 카테고리의 다른 글
| JavaScript - DOM 개념과 간단한 실습! (0) | 2022.03.27 |
|---|---|
| Javascript 객체 (0) | 2022.03.21 |
| Javascript 배열, 함수 (0) | 2022.03.21 |
| Javascrpit 반복문 (0) | 2022.03.21 |
| Javasript 기본문법, 입력문, 출력문, 변수 (0) | 2022.03.20 |
댓글