방장 공부하자 (WEB, JAVASCRIPT 3.5)

라ㅡ떼·2022년 7월 12일
JavaScriptbang-jang-seriesweb
0

web

목록 보기
4/5

변수의 유효 범위

  • 자바스크립트에서 객체나 함수는 모두 변수(variable)이다.
  • 변수의 유효 범위(scope)란 해당 변수가 접근할 수 있는 변수, 객체 그리고 함수의 집합을 의미한다.
  • 변수의 유효 범위에 따라 다음과 같이 구분된다.
    • 지역변수
    • 전역변수

지역변수

  • 지역 변수(local variable)란 함수 내에서 선언된 변수를 가리킨다.
  • 이러한 지역 변수는 변수가 선언된 함수 내에서만 유효, 함수가 종료되면 메모리에서 사라진다.
  • 함수의 매개변수 또한 함수 내에서 정의되는 지역변수처럼 동작한다.
function localNum(){
  var num = 10;
  console.log("함수 내부에서 변수 num의 타입은 " + typeof num + "이다."); // num이란 변수가 유효

}

localNum();
console.log("함수의 호출이 끝난 뒤 변수 num의 타입은 " + typeof num + "이다."); // num이란 변수가 유효하지 않기 때문에 undefined로 반환

전역변수

  • 전역변수(global variable)란 함수의 외부에서 선언된 변수를 가리킴
  • 이러한 전역변수는 프로그램의 어느 영역이나 접근할 수 있으며, 웹 페이지가 닫혀야만 메모리에서 사라진다.
var num = 10;
function globalNum(){
  console.log("함수 내부에서 변수 num의 타입은 " + typeof num + "이다."); // 함수안에서 선언이 없어도 함수밖에 선언된 num이란 변수가 유효
  num = 20; //내부에서 변수 변경

}
globalNum(); //함수 globalNum()을 호출
console.log("함수의 호출이 끝난 뒤 변수 num의 타입은 " + typeof num + "이다."); // 20으로 변경

매개변수

  • 자바스크립트에서는 함수를 정의할 때는 매개변수의 타입을 따로 명시하지 않는다.
  • 함수를 호출할 때도 인수(argument)로 전달된 값에 대해 어떠한 타입 검사도 하지 않는다.
  • 함수를 호출할 때 함수의 정의보다 적은 수의 인수가 전달되더라도, 다른 언어와는 달리 오류를 발생시키지 않는다.
  • 이 같은 경우 자바스크립트는 전달되지 않은 나머지 매개변수에 자동으로 undefined 값을 설정한다.
  • 다음 예제는 3개의 매개변수를 가진 함수에 대해 각각 다른 수의 인수를 전달하는 예제.
  function addNum(x, y, z) { // x, y, z라는 3개의 매개변수를 가지는 함수 addNum()을 정의함.
    return x + y + z;
  }

addNum(1, 2, 3); // 인수로 1, 2, 3을 전달하여 함수를 호출함. -> 6
addNum(1, 2);    // 인수로 1, 2을 전달하여 함수를 호출함. -> NaN
addNum(1);       // 인수로 1을 전달하여 함수를 호출함. -> NaN
addNum();        // 인수로 아무것도 전달하지 않고 함수를 호출함. -> NaN

미리 정의된 전역함수

  • 자바스크립트는 사용자의 편의를 위해 다양한 기능의 여러 전역 함수를 미리 정의하여 제공한다.
  • 이러한 전역 함수는 자바스크립트의 어떤 타입의 객체에서도 바로 사용할 수 있다.
  • 자바스크립트에서 제공하는 전역함수는 다음과 같다.

eval()

  • 문자열로 표현된 자바스크립트 코드르 실행하는 함수
  • 구문 및 예제
      - 구문
      eval("문자열")
      - 예제
      var x = 10, y = 20;
      var a = eval("x + y");
      var b = eval("y + 3");
      console.log(a + "\n" + b);

isFinite()

  • 전달된 값이 유한한 수인지를 검사하여 그 결과를 반환한다.
  • 만약 인수로 전달된 값이 숫자가 아니라면, 숫자로 변환하여 검사한다.
      - 구문
  isFinite(검사할 값);
  - 예제
  isFinite(123);       // true
  isFinite(123e100);   // true
  isFinite(0);         // true

isNaN()

  • isNaN() 함수는 전달된 값이 NaN인지를 검사하여 그 결과를 반환한다.
  • 만약 인수로 전달된 값이 숫자가 아니라면, 숫자로 강제 변환하여 검사한다.
  • 전달된 값이 숫자인지 아닌지를 확인하기 위하여 typeof 연산자를 대신 사용할 수도 있다.
      - 구문
  isNaN(검사할값);
  - 예제
  isNaN(123);       // false
  isNaN(123e100);   // false

parseFloat()

  • parseFloat() 함수는 문자열을 파싱하여 부동 소수점 수(floating point number)로 반환한다.
      - 구문
  parseFloat("문자열");
  - 예제
  parseFloat("123");        // 123
  parseFloat("123.000");    // 123

parseInt()

  • parseInt() 함수는 문자열을 파싱하여 정수로 반환한다.
      - 구문
  parseInt("문자열");
  - 예제
  parseInt("123");        // 123
  parseInt("123.000");    // 123
  parseInt("123.456");    // 123

encodeURI() & encodeURIComponent()

  • encodeURI() 함수는 URI에서 주소를 표시하는 특수문자를 제외하고, 모든 문자를 이스케이프 시퀀스(escape sequences) 처리하여 부호화

  • encodeURIComponent() 함수는 URI에서 encodeURI() 함수에서 부호화하지 않은 모든 문자까지 포함하여 이스케이프 시퀀스 처리.

      - 구문
  encodeURI(부호화할URI);
  encodeURIComponent(부호화할URI);
  - 예제
  var uri = "http://google.com/search.php?name=홍길동&city=서울";
  var enc1 = encodeURI(uri);
  var enc2 = encodeURIComponent(uri);

  console.log(enc1 + "<br>" + enc2);

decodeURI() & decodeURIComponent()

  • decodeURI() 함수는 encodeURI() 함수나 다른 방법으로 만들어진 URI(Uniform Resource Identifier, 대충 자원 식별자)를 해독.
  • decodeURIComponent() 함수는 encodeURIComponent() 함수나 다른 방법으로 만들어진 URI 컴포넌트를 해독.
      - 구문
  decodeURI(해독할URI);
  decodeURIComponent(해독할URI);
  - 예제
  var enc1 = encodeURI(uri);
  var enc2 = encodeURIComponent(uri);
  console.log(enc1 + "/n" + enc2 + "<br><br>");
  var dec1 = decodeURI(enc1);
  var dec2 = decodeURIComponent(enc2);
  console.log(dec1 + "/n" + dec2);

Number()

  • 들어온 객체의 값을 숫자로 반환한다.
  • 문법
Number(객체);

String()

  • 전달받은 객체의 값을 문자열로 반환한다.
String(객체);
profile
라ㅡ떼
개발 글 싸개
이전 포스트

방장 공부하자 (WEB, JAVASCRIPT 3)

다음 포스트

방장 공부하자 (WEB, JAVASCRIPT 4)

0개의 댓글