JS ( 변수, 자료형 )

DeadWhale·2022년 5월 11일
0

JS

목록 보기
3/12
post-thumbnail

변수 범위

  • (변수타입) 변수명 ;
    [변수타입을 생략하면 그냥 전역변수로 설정된다.]
var num1 ;  // 전역변수(선언된 후 같은 문서내에 어디에서든지 사용 가능.)
num2;       // 전역변수(먼 근본 없는 놈이야,  변수명 앞에 아무런 키워드가 없으면 전역변수가 된다.)

function test(){
  var num3; // 이 test함수 내에서만 사용 가능하다.
  num4      // 전역변수( 변수 앞에 아무런 키워드가 없으면 전역변수가 된다.)

    if(조건){
        var num5;// 사용된 function 지역변수. ( 진짜 근본없는 언어네)
        num6     // 전역변수( 변수 앞에 아무런 키워드가 없으면 전역변수가 된다.)
    }
}

변수의 종류

Var

  • 변수
  • ES5이전에 주로 사용되던 변수 (좀..개념없다)
  • 변수명의 중복 허용 (먼저 선언된 변수를 덮어쓴다.)

let

  • 변수
  • 변수명 중복 불가
  • 블럭 {} 레벨 scope : 블럭안에서만 사용 가능하다.

const

  • 상수(자바에서 final)
  • 변수명 중복 불가
  • 블럭 {} 레벨 scope

각 변수별 사용 빈도

1위 : const
2위 : let
3위 : var (구시대의 유물)


js는 보통 특정 요소를 선택해 사용하는 경우가 많아서
변수를 고정 시켜놓는다


JS의 자료형

JS는 자료형을 따로 선언하지는 않지만 존재한다.

변수에 대입되는 값에 맞쳐 자동으로 자료형이 세팅된다.

  • String (문자열)
  • number(숫자) : 정수/실수 모두 포함 (SQL과 같은 타입)
  • boolean(True/false) : 결과에 따라 반환함
  • object(객체) ->배열(Array): 그냥 배열을 의미함.
  • JS객체{K:V , k:v} : Map과 비슷한 모습 여러개의 k:v가 들어갈수 있다.(map+배열 느낌?)
  • function(함수) : JS는 변수에 함수 자체를 저장할 수 있다.
  • undifined(정의되지 않는 변수) : 선언만되고 어떤자료도 들어가지 않는 상태.

object(배열)

배열 이 접근하는 것 처럼 접근해야한다 ( 반복문 )

//js 에서 배열 ( 대괄호 사용 필요)
const arr = [10,30,70,50];
typeBox.innerHTML +="<br>arr:"+arr+"/"+typeof arr;
    
for(let i=0; i<arr.length;i++){
typeBox.innerHTML +="<br>arr["+i+"] : "+arr[i];
}

JS객체(K:V , k:V)

두가지 방법이 있다.

//자바스크립트 객채 K:V (map형식)으로 작성
const user = {"id":"user01","pw":"pass01"};
typeBox.innerHTML += "<br>user : "+user+"/"+typeof user;
//단순 js 객체는 toString 오버라이딩이 안된거처럼 조회가 안된다.

//1번 방법 하나씩 조회
typeBox.innerHTML += "<br>user.id : "+user.id+"/"+typeof user.id;
typeBox.innerHTML += "<br>user.pw : "+user.pw+"/"+typeof user.pw;

//2번 방법 (객체 전용 for문 (for...in ) )
for(let key in user){
//user 객체의 key (id,pw)를 반복 할 때 마다 하나씩 얻어와 key 변수에 저장
    typeBox.innerHTML += "<br>user["+key+"] : " + user[key];
}

//가장 쉬운건 콘솔로 그냥 보는거
console.log(user);

function(함수)

const sumFn = function(n1,n2){//이름이 없는 함수== 익명함수.
	return n1+n2;
}

//함수명만 작성한 경우 -> 함수에 작성된 코드가 출력됨.
typeBox.innerHTML += "<br>sumFn : "+sumFn+"/"+typeof sumFn;
//함수명 () 괄호 포함해 작성시 호출후 동작.
typeBox.innerHTML += "<br>sumFn : "+sumFn(20,35)+"/"+typeof sumFn;

//2번 함수를 매개변수로 전달
typeBox.innerHTML += "<br>tempFn(30,sumFn) : "+tempFn(30,sumFn)
}

function tempFn(n3,fn){
return n3 +fn(10,20);
}

이 파트 핵심

1) var 쓰면 안좋은 일이 자꾸 생긴다
2 ) 변수 앞에 아무것도 안붙이면 자동으로 전역변수가 된다
3 ) 변수에 자료형은 값이 대입되면 자동으로 지정된다.

0개의 댓글