본문 바로가기
Programming/Javascript

생활코딩 자바스크립트 반복문까지

by Saans 2022. 1. 14.

모든 출처 생활코딩

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의 데이터 타입을 문자로 형태를 변환하는 명령
    }
}

 

댓글