[JS] 자바 스크립트 1일차 Review

[JS] 자바 스크립트 1일차 Review

 

1. 기본 함수 및 문법중 알게 된 것

⦁ alert() <-- 웹 브라우저에 경고창 띄우기

⦁ JS에서는 문자열 비교에 equals()안쓰고 == 사용한다.

⦁ Number(true)=1, Number(false)=0 으로 출력된다.

⦁ 변수 선언시 중복선언 가능하며, 중복선언시 최종선언 값만 저장된다.

⦁ 재 선언시 주의할 점 

   var alter = 'A' 로 기존 alter함수 재선언 할 수 있는데, alter(alter) 하면 경고메시지 출력되지 않는다.

 

⦁ prompt() -> prompt('메세지', '기본출력값') - 사용자에게 입력을 요구하는 입력창이 팝업으로 뜬다.

⦁ boolean 형식을 리턴받을 때 사용하는 함수는 confirm('메시지 출력')이다.  - 사용자에게 확인, 취소 를 선택하게

   하는 팝업창을 띄운다. 확인시 true, 취소시 false를 반환한다.

 

⦁ 수의 타입은 하나로 double 이다.

⦁ 문자열 수와 기본형 수의 연산

 123 + '456' = 123456 // 123 - '123' = 0

 '123' + '456' = 123456 // '123 - '123' = 0

 123 + 456 = 579 // 123 - 123 = 0

 '123 + 456' = "123 + 456" // '123 - 123' = "123 - 123"

 

⦁ 문자열 숫자를 수로 바꾸는 방법

  1. Number() 사용

     Number("123"); "123"-> 123 으로 바뀐다.

  2. parseInt() 사용

     parseInt("123"); "123"-> 123으로 바뀐다.

  3. Number()과 parseInt()의 차이점

     바꿀 수 없는 문자를 넣을 경우 Number()은 NaN 나온다. (Not a Number)

     NaN을 확인할 때는 반드시 isNaN()함수를 사용해야 한다.

 

⦁ 문자열로 바꾸는 방법

  1. String() 사용

     String(123); -> String 타입으로 바뀐다. 즉 123이 "123"으로 바뀐다.

 

     변환함수는 3개 Number() String() Boolean() 변환이 된다. (사실 생성자이다.)

 

⦁ 변수의 타입을 알고 싶을 때 typeof(변수) 로 검사하면된다.

   ex) var x=10; typeof(x); 반환값은 타입을 문자열로 출력한다.

        타입의 종류는 기본형 (boolean, number, string, null, undefind) + 참조형 (object, function) 이 있다.

 

⦁  값 비교

 == : 값만 비교, === : 값, 타입 비교한다.

 != : 값만 비교, !== : 값, 타입 비교

 

 이항연산자는 양 변 타입을 자동형변환으로 맞춘다. 그러나 !== 에서는 자동형변환 하지 않는다.

 자동 형변환에 의지하지말자 "0"==0 -> true / []==0 -> true "0"==[] -> false 나온다.

 따라서 값이 같은지 비교할 때 === 쓰자.

 

⦁ 템플릿 문자열

 템플릿 문자열은 ` 기호로 감싸 만들며, 문자열 내부에 '${}'기호를 사용하고 내부에 표현식을 넣으면, 문자열이 만들어

 질 때 표현식이 계산되어 들어간다. 단 모든 버전의

 인터넷 익스플로러에서 돌아가는것은 아니다.

   ex) alert(`덧셈 테스트 x=5, y=12일때 x+y= ${x+y}이다.`)

        var x=5

        var y=12

        alert(`덧셈 테스트 x=5, y=12일때 x+y= ${x+y}이다.`)

 

⦁ 스코프 : 특정 변수를 사용할 수 있는 유효범위

  변수 선언하는 방법은 let 과 var 두 가지가 있다.

  let은 해당 스코프에서만 선언 가능하며 재선언 불가능하다. 또, 해당 스코프가 끝나면 제거된다.

  var은 어디서든 선언 가능하며, 재선언 가능하다.

  const는 상수로, 해당 스코프에서 선언 가능하며 재선언 불가능하다.

 

⦁ if 문같은경우 if() 조건식 안이 꼭 true 나 false를 안 넣어도 된다.

 1처럼 true 역할을 하는 값을 넣어도 된다. Boolean(1) = true, Boolean(0)=false 나온다. 즉 0 아닌것중 0, null, 

 undefinded, NaN 은 false 사용할 값이 true 인지, false인지 확인하고싶으면 !!null 찍어보면 된다 false 나오면 false

 

⦁ if(!b){b=52;} // -> 짧게 하려면 b=b||52; 로 나타낼 수 있다. b값이 있을경우 b값 사용, 없으면 52 사용한다.

  JS에서 변수 초기화할 때 b=b||0; 이런식으로 초기화 많이 한다.

 

⦁ 배열

 JS는 처음에 변수 선언할 때 타입이 없다. 이 변수들은 어떤 타입이 되었건 한 배열에 모두 집어넣을 수 있다.

 arr.length 와 arr["length"] 두 표현 모두 가능하다.

 arr.0 이건 안된다. arr[0] 이건 된다.

 

⦁ JS에서 향상된 for문

 for (i in arr) console.log(arr[i]); 자바의 향상된 for문에서는 for (i in arr) console.log(i); 처럼 뒷 부분에 i 만 써도 되는데 JS에서는 arr[i]로 해야 한다.

 

⦁ 함수

 var 함수 = function(){var output=prompt('숫자입력해주세요.','숫자')' alert(output);}; 여기서 사용한 함수 function(){}꼴은 함수에 대한 이름이 없으므로 익명함수이다.

 JS에서 함수를 호출한다는 것은 함수를 실행하는 것 이다. JS에서 함수는 하나의 자료형이지만, 다른 자료형과 다르게 괄호를 열고 닫음으로 코드를 실행한다.

 함수의 선언 방법은 2가지있다.

   1. 익명함수

       var 함수 = function(){코드 작성};

   2. 선언적 함수

       function 함수(){ 코드 작성};

       웹 브라우저는 script 태그 내부의 내용을 한 줄씩 읽기 전에 선언적 함수부터 읽는다.

 

⦁ JS는 오버로딩이 불가능하기 때문에, if절로 arguments의 요소 개수에 따라 조건 설정한다.

    ex)

         < script> function test(a,b,c,d){alert(`${a}:${b}:${c}:${d}`);}

         var array = {1,2,3,4};
         test(...array) 

         test(array)하면 통채로 a에만 들어간다. 배열이 2개 이상을 합칠때도, test(...array1,...aray2) 로 하면 된다.
         const originalArray=[1,2,3,4,5]; 일 때, const newArray=[...originalArray]; 하면 깊은 복사가 된다.

 

⦁ 함수 프로토타입

프로토 타입은 생성자 함수로 생성된 객체가 공통으로 가지는 공간이다. 이 곳에 함수를 선언하는 방법은 두 가지 있다.
 1. 함수명.prototype.메서드명 = function(){};
 2. 함수의 객체를 p라 했을 때 p.__proto__.메서드명=function(){};
    ex)
        < script> function Point(x,y,z){
        this.x=x; this.y=y; this.z=z; }
         p = new Point(1,2,3);

 

1. 방법
         point.prototype.toString2=function(){return this.x+" "+this.y+" "+ this.z;}
2. 방법
         p.__proto__.toString2=function(){return this.x+" "+this.y+" "+this.z;}