js 선언
- ;(세미콜론)은 명령단위를 구분하기 위해서 사용하는데 줄 단위는 생략이 가능하다
- 식별자(변수명)
1) 키워드 사용금지, 숫자로 시작금지, 특수문자(_,$)만 허용, 공백 사용금지
2) 객체형으로 사용될 선언부분은 대문자로 선언, 참조변수, 메서드명은 소문자로 시작
3) 합성어는 구분자를 대문자로 표시 - 주석처리는 자바와 동일 (//, /*/)
cf) html 주석
css 주석 *
jsp 주석 <%-- --%>
- 문자열 사용
- 큰 따옴표, 작은 따옴표,
문자
- 큰 따옴표, 작은 따옴표,
cf) console.log 변수 사용
var num = 6744;
var loc = "마포구 창신동";
console.log{`
버스번호 : ${num}
목적지 : ${loc}
이다.
`}
// ${변수명} - 이 형식표현으로 변수 사용 가능 (주의 : jsp의 el태그와 충돌)
5. 연산자 사용
1) 숫자형 중 정수/정수 ==> 실수 처리
parseInt() 함수를 통해서 소수점 절삭 처리 가능
2) 비교 연산자
- 모든 숫자형 문자열을 + 기호 이외 자동형변환이 되므로 연산이 가능하다
- === : 데이터 유형과 데이터가 모두 같을 때 true
- !== : 데이터 유형이나 데이터가 같지 않을 때, true
- == : 데이터 유형이 같지 않더라도 형변환이 되었을 때 데이터가 같으면 true
6. 데이터 유형 : typeof() 함수를 통해서 유형을 확인할 수 있다
1) 문자열형(String)
2) 숫자형(number)
3) boolean형
4) 함수형(function)
5) 객체형(object)
* 객체형
var obj01 = {name:'홍길동'} // json(javascript object notation)
--> 가장 많이 쓰이는 객체 생성 방식
function Person(name, age){
this.name=name; this.age=age;
} // this.가 사용되면 객체 유형
var arry=['사과','복숭아','파인애플'] // 배열형 객체- 데이터가 없는 부분에 대한 처리
1) 변수를 선언하고 할당하지 않는 경우 : undefined, 에러는 표기하지 않음
2) 선언되지 않은 변수를 호출하는 경우 : not undefined, 에러 표기, 코드 진행 불가
3) NaN : not a number, 숫자형이 아닌데 형변환 처리할 때 - 변수 선언 형식(es6 이후)
1) 지역변수 : 특정한 범위의 괄호 안에서만 사용가능하고 영향을 미치는 변수
2) 전역 변수 : 다른 괄호(범위)에서도 사용 가능하고 영향을 미치는 변수
3) 상수 : 초기 변수를 할당했을 때, 변경되지 않는 데이터 처리
//1. 전역변수
var gloVal = 52;
//2. 전역/지역변수
let localGlobalVal =280;
//3. 상수
const constVar = 103;
ex) h1 좋아요를 클릭하면 하트 증가, h1 싫어요를 클릭하면 하트 감소
<script>
let likePt = 0;
function likeHandler(){
likePt++;
showLike()
}
function disLikeHandler(){
likePt--;
showLike()
}
function showLike(){
var show= document.querySelector("#show");
show.innerText=""; // 초기화
for(let cnt=1;cnt<=likePt;cnt++){
show.innerText +="♥";
}
}
</script>
<body>
<h1 onclick="likeHandler()">좋아요</h1>
<h1 onclick="disLikeHandler()">싫어요</h1>
<h2 id="show"></h2>
</bodt>
아자아자 화이팅