모든 출처 생활코딩
- http://ejohn.org/apps/learn/
jQuery를 만든 John Resig의 JavaScript 고급 강의 - https://developer.mozilla.org/ko/docs/JavaScript/Guide
Firefox의 모질라 재단에서 운영중인 자바스크립트 튜토리얼 - http://opentutorials.org/course/50
JavaScript 사전 - http://www.html5rocks.com/ko/
alert 경고박스
console.log
//숫자
Math.pow(3, 2); //9, 3의 2승
Math.round(10.6); //10.6을 반올림
Math.ceil(10.2); //10.2를 올림
Math.floor(10.6); //10.6을 내림
Math.sqrt(9); //3의 제곱근
Math.random(); //0부터 1.0 사이의 랜덤한 숫자
-문자 string
문자는 큰따옴표 혹은 작은 따옴표 하나로 감싸야한다
숫자를 따옴표로 감싸면 문자가 됨
typeof : 값의 데이터형을 알려주는 기능
\(역슬래쉬) escape 문자열의 시작과 끝을 구분하는 구분자가 아니라 단순히 문자로 해석하도록 강제 할 수 있음
\n 줄바꿈
문자와 문자를 더할 때
alert("coding" + "everybody");
문자의 길이를 구할 때는 문자 뒤에 .length를 붙임
alert("coding everybody".length)
자바스크립트 사전 String - 생활코딩 (opentutorials.org)
-변수선언
var a = 1;
alert(a+1); //2
//는 주석 /* */ 여러줄 주석
세미콜론; 은 하나의 구문이 끝났음을 명시적으로 나타내는 기호. 한 줄에 여러 구문을 사용하고 싶을 때 유용
a = 1; alert(a+1);
자바스크립트에서는 세미콜론 생략가능, 이 경우 줄바꿈을 명령의 끝으로 간주
변수의 값이 숫자만 올 수 있는 것은 아님
var first = "coding";
alert(first+" everybody");
var a = 'coding', b = 'everybody';
alert(a);
alert(b);
-변수의 효용
반복되는 작업의 수고를 덜어줌
a = 100;
a = a + 10;
alert(a);
a = a / 10;
alert(a);
- a = 1 a 라는 변수에 1을 대입
- 비교 연산자
동등 연산자 ==
alert(1==2) //false
alert(1==1) //true
alert("one"=="two") //false
alert("one"=="one") //true
일치 연산자 === _좌항과 우항이 정확하게 같을때 true
아주 중요 버그의 원인이 될 수 있다
alert(1=='1'); //true
alert(1==='1'); //false
참고 == 와 ===의 차이점
JS Comparison Table (dorey.github.io)
alert(null == undefined); //true
alert(null === undefined); //false
alert(true == 1); //true
alert(true === 1); //false
alert(true == '1'); //true
alert(true === '1'); //false
alert(0 === -0); //true
alert(NaN === NaN); //false
null, undefined 값이 없다는 데이터 형
null은 값이 없음을 명시적으로 표현
undefined는 그냥 값이 없는 상태
NaN는 0/0과 같은 연산의 결과로 만들어지는 특수한 데이터형, 숫자가 아니라는 뜻
!= 같지 않다
alert(1!=2); //true
alert(1!=1); //false
alert("one"!="two"); //true
alert("one"!="one"); //false
!==는 != 와 ==의 관계와 같음 정확하게 같지 않다
> 와 <
boolean 참과 거짓
-조건문 if, else, else if
if(true){
alert(1);
} else {
alert(2);
} //1
if(false){
alert(1);
} else if(true){
alert(2);
} else if(true){
alert(3);
} else {
alert(4);
} //2
prompt() 사용자가 입력한 값을 가져와서 id 변수의 값으로 대입
조건문의 중첩
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<script>
id = prompt('아이디를 입력해주세요.');
if(id=='egoing'){
password = prompt('비밀번호를 입력해주세요.');
if(password==='111111'){
alert('인증 했습니다.');
} else {
alert('인증에 실패 했습니다.');
}
} else {
alert('인증에 실패 했습니다.');
}
</script>
</body>
</html>
-논리연산자
&& AND
|| OR
! NOT 부정
-boolean 의 대체제
0 과 1
0은 false 1은 true
//기타 false로 간주되는 데이터 형
if(!''){
alert('빈 문자열')
}
if(!undefined){
alert('undefined');
}
var a;
if(!a){
alert('값이 할당되지 않은 변수');
}
if(!null){
alert('null');
}
if(!NaN){
alert('NaN');
}
-반복문 loop, iterate
while
<br /> 줄바꿈을 의미하는 html 태그
while (조건) {
반복해서 실행할 코드
}
var i = 0;
while(i < 10) {
document.write('coding everybody <br />');
i++
}
for
for(초기화; 반복조건; 반복이 될 때마다 실행되는 코드){
반복해서 실행될 코드
}
for(var i = 0; i < 10; i++){
document.write('coding everybody'+i+'<br />');
}
//굴 욮애 2의 배수씩 숫자 붙이기
var i = 0;
while(i < 10){
document.write('coding everybody '+(i*2)+'<br />');
i++;
}
-반복문의 제어
break _반복작업의 중단
continue _실행은 즉시 중단하며 반복은 지속되게
-반복문의 중첩
//0부터 9까지 변수 i에 순차적으로 값 할당
for (var i = 0; i < 10; i++) {
//0부터 9까지의 변수를 j의 값에 순차적으로 할당
for (var j = 0; j < 10; j++) {
document.write(String(i)+String(j)+'<br />');
//i와 j의 값을 더한 후에 출력
//String은 숫자인 i와 j의 데이터 타입을 문자로 형태를 변환하는 명령
}
}
'Programming > Javascript' 카테고리의 다른 글
자바스크립트 객체 지향 (0) | 2022.02.11 |
---|---|
자바스크립트 콜백, 비동기처리. 비동기 콜백 (0) | 2022.02.06 |
생활코딩 자바스크립트 함수 (0) | 2022.01.16 |
생활코딩 자바스크립트 객체, 모듈, API (0) | 2022.01.15 |
js부터 공부 (0) | 2021.12.30 |
댓글