JavaScript_10분_가이드


Youngrok Pak at 5 years, 10 months ago.

자바스크립트의 필수적인 기본 문법에 대한 설명.

자바스크립트의 기본 자료형#

  • 숫자 - 1803, 3.141592
  • 논리값 - true, false
  • 문자열 - 'Hello' "Hello"
  • null - 존재하는 변수지만 값이 없는 경우
  • undefined - 존재하지 않는 변수
    • if (a == null || a == undefined) doSomething();
      if (a) doSomthing();
  • 숫자 + 문자열 => 문자열 - 21 + '세기' => '21세기'

  • 배열
    • var units = ['SCV', 'Marine', 'Firebat', 'Vulture']
  • 객체

변수#

  • 변수 선언
    • var name = 'Bill' // 지역 변수
      movieName = 'Kill Bill'  // 전역 변수
      const PI = 3.141592 // 상수

정규식#

  • 정규식 만들기
    • regex = /[a-z][a-z0-9]*/
      regex = new RegExp('[a-z][a-z0-9]*')
  • 연속 검색
    • var regex = /[a-z]+/ig
      result = regex.exec('abc ABC')
      alert([result[0], regex.lastIndex]) // abc, 3
      
      result = regex.exec('abc ABC')
      alert([result[0], regex.lastIndex]) // abc, 7
  • 괄호로 부분 매칭
    • result = /([A-Z][a-z]+)File/.exec('abcFile, AbcFile')
      alert([result[0], result[1]])
  • 정규식 매칭 검사만
    • isEmail = /\w+@\w+\.\w+/.test('hongmanchoi@k1.com')
  • 바꾸기
    • re = /(\w+)\s(\w+)/;
      str = "John Smith";
      newstr = str.replace(re, "$2, $1");
      document.write(newstr) // Smith, Jonh
  • 함수로 바꾸기
    • re = /(\w+)\s(\w+)/;
      str = "John Smith";
      newstr = str.replace(re, function(str, p1, p2) {
              return str + ' -> ' + p2 + ', ' + p1
      });
      document.write(newstr) // John Smith -> Smith, John

함수#

  • 선언
    • function plus(a, b) {
              return a + b
      }
      alert(plus(1, 2))
  • 대입 가능
    • plus = function(a, b) {
              return a + b
      }
      alert(plus(1, 2)) // 1 + 2 => 3
  • arguments 객체
    • function plusAll() {
              var sum = 0
              for (var i = 0; i < arguments.length; i++) {
                      sum += arguments[i]
              }
              return sum
      }
      alert(plusAll(1, 2, 3)) // 1 + 2 + 3 => 6
  • eval() 함수
    • alert(eval('1 + 2')) // 3

객체#

  • 객체의 속성
    • myCar.make = "Ford"
      myCar.model = "Mustang"
      
      myCar["make"] = "Ford"
      myCar["model"] = "Mustang"
      
      function show_props(obj, obj_name) {
         var result = "";
         for (var i in obj)
            result += obj_name + "." + i + " = " + obj[i] + "\n";
         return result;
      }
  • for ~ in으로 속성 읽기
    • var myHonda = {color:"red",wheels:4,engine:{cylinders:4,size:2.2}};
      for (prop in myHonda) {
         alert([prop, myHonda[prop]])
      }
  • Constructor
    • function Person(name, age, sex) {
         this.name = name;
         this.age = age;
         this.sex = sex;
      }
      rand = new Person("Rand McKinnon", 33, "M");
      ken = new Person("Ken Jones", 39, "M");
      
      alert(rand.age) // 33
  • Object Initializer
    • myHonda = {color:"red",wheels:4,engine:{cylinders:4,size:2.2}};
  • 이미 존재하는 타입에 속성 추가
    • function Person(name, age, sex) {
         this.name = name;
         this.age = age;
         this.sex = sex;
      }
      Person.prototype.marrried = null
      
      jones = new Person('Indiana Jones', 27, 'M')
      jones.married = false
  • 메소드 정의, Constructor에서
    • function Person(name) {
         this.name = name;
         this.eat = function() {
             this.eaten = true
         }
      }
      p = new Person('Bill')
      p.eat()
  • 메쏘드 정의, 타입의 prototype 이용
    • function Person(name) {
         this.name = name;
      }
      Person.prototype.eat = function() {
         this.name = name;
      }
      p = new Person('Bill')
      p.eat()
  • 메쏘드 정의, 객체의 속성으로
    • function Person(name) {
         this.name = name;
      }
      p = new Person('Bill')
      p.eat = function() {
         this.name = name;
      }
      p.eat()
  • getter, setter
    • js> o = new Object;
      [object Object]
      js> o = {a:7, get b() {return this.a+1; }, set c(x) {this.a = x/2}};
      [object Object]
      js> o.a
      7
      js> o.b
      8
      js> o.c = 50
      js> o.a
      25
      js>
  • 속성 삭제
    • delete o.a
  • 상속
    • Child.prototype = new Parent


Comments




Wiki at WikiNamu