자바스크립트 정리

지금까지 배운 것들 중에 부족한 부분들 정리

 

 

 

 

사실 다 부족하지만 그 중에 

아직도 바로바로 안나오고 익숙하지 않은 용어들을 정리해보면서 공부해보려고 한다.

 

이제는 익숙한 용어들도 한 번 더 정리하면서 머리에 익히기!

 

JAVASCRIPT

기본 명령어

 

prompt(명령, 메세지) : 사용자의 정보를 얻기위해 띄우는 입력창

prompt('당신의 나이는 몇살입니까?');

prompt로 불러온 입력창

alert(알림, 경보)  : 사용자에게 띄우는 안내창 (경고창으로 많이 쓰임)

alert('자바스크립트');

alert으로 띄운 안내창

confirm(확정) : 사용자에게 띄우는 확인창

confirm('정말 삭제 하시겠습니까?');

confirm으로 띄운 확인창

 

 

 

 

 

변수(var, let)

//변수 변수명 = 데이터(값);
var num = 10;
var str = 'javascript';
var temp = true;

var는 변수 선언을 의미

num, str, temp는 변수를 구분하는 이름(변수명)

'javascript', true는 변수에 저장되는 데이터(값)

 

str(string)문자 데이터

' ' 작은따옴표 또는 " " 큰따옴표로 표현할 수 있다.

 

var와 let의 차이

var num = 10;
var num = 20; 
document.write(num);
//20

let num = 10;
let num = 20;
document.write(num);
//에러

var는 동일한 변수를 중복해서 선언할 수 있지만

let은 이미 선언한 변수를 중복해서 선언할 수 없다.

let x = 10;
let x = 20;
document.write(x);
//에러

let x = 10;
x = 20;
document.write(x);
//20

변수(let) 선언을 다시 하지 않고

변수명(x)으로 데이터값 중복은 가능하다

 

 

 

데이터타입(Date Type)

boolean(논리)데이터, 비교 연산자

boolean은 true와 false 의 값을 표현

따라서 비교 연산자는 값을 비교하여 결과 값을 boolean 값인 true나 false로 반환

var temp1 = (5 > 4);
var temp2 = (5 < 4);
console.log(temp1); //true
console.log(temp2); //false

var temp1 = o; //0의 boolean은 false을 의미
var temp2 = 1; //1의 boolean은 true을 의미
console.log(Boolean(temp1)); //false
console.log(Boolean(temp2)); //true

Boolean() 명령어는 변수의 값을 flase나 true로 변환

 

 

 

 

nudifiend 데이터와 null 데이터의 차이

undifiend 데이터는 변수 선언은 하였으나 데이터 값을 지정하지 않았을때,

객체의 속성 값을 지정하지 않았을 경우 자동으로 저장되는 값.

 

null 데이터는 변수를 빈(empty) 상태(초기화)로 만들거나,

데이터를 저장하였으나 값이 존재하지 않을 때 null값을 반환.

 

 

 

 

typeof 명령

변수에 저장되어있는 데이터의 타입을 알아보는 방법

var num =10;
var str = '문자';
console.log(typeof num); //number
console.log(typeof str); //string

 

 

 

 

 

조건문

조건에 따라 명령 실행 순서를 바꾸거나 특정한 부분을 계속해서 반복하려면 조건문이나 반복문을 사용해야 한다.

명령을 실행하기 위해 조건을 체크하는 문.

 

if문

if (조건문) {
	조건에 따라 true일 때 실행할 명령
    }

let  x = 10
if (x > 5){
	console.log("x는 5보다 큽니다.")
    }

if문에서 x > 5가 true인지 체크,

지금 x의 값은 10이므로 true.

if문의 { } 명령을 실행.

 

 

다중if(else if)

if문 이후 여러 개의 조건을 검사해야 할 경우 사용

여러개의 조건 중 하나가 참인 경우 해당하는 값을 실행하고 전체 if문을 종료

if(1){
    document.write("실행되었습니다.(ture)");
} else {
    document.write("실행되었습니다.(false)");
}
//true

❗ false : 0(숫자 0만), null, undefined, false, " "(빈문자열)

❗ true : 1,2,3(숫자 0빼고), "0"(문자열로는 가능), 문자, [ ]배열, { }객체, true

 

 

 

swich문

체크해야 할 조건이 많을 경우

여러개의if...else문을 사용하는 것보다 swich문을 사용하는게 좋다.

const num = 100;

switch(num){
    case 90:
        document.write("실행90");
        break;
    case 80:
        document.write("실행80");
        break;
    case 70:
        document.write("실행70");
        break;
    case 60:
        document.write("실행60");
        break;
    case 50:
        document.write("실행50");
        break;                                                
        document.write("0")
}
//0

 

 

 

 

반복문

forEach문

for문보다 좀 더 편리하게 반복할 수 있다.

const num = [100, 200, 300, 400, 500];

num.forEach(function(el){
    document.write(el, "<br>");
});
//100/200/300/400/500

num.forEach(function(element, index, array){
    document.write(element, "<br>");
    document.write(index, "<br>");
    document.write(array, "<br>");
});
//100/0/100/200/300/400/500
//...
//500/4/100/200/300/400/500

배열명 뒤에 .forEach 함수를 사용해 el(element)값을 불러올 수 있다.

element 요소값, index 인덱스값, array 배열값

 

for of 문

const arr = [100, 200, 300, 400, 500];

for(let i of arr){
    ocument.write(i);                               
}
//100200300400500

for of 문을 사용해 배열값을 불러올 수 있다.

 

for in 문

const arr = [100, 200, 300, 400, 500];

for(let i in arr){
    document.write(i);                             //01234 객체를 불러오는 (자릿수값)
    // document.write(arr[i]);                     //배열을 불러오고 싶으면 arr[i]로 불러오기
}
//01234

for in문은 객체의 자릿수값(index)을 불러오는 방법