개발정리

Chapter8 메소드 본문

JS/javascript

Chapter8 메소드

성구님 2017. 4. 9. 13:38
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

01 배열

02 함수

03 숫자

04 객체

05 정규 표현식

06 문자열

 

 

01 배열

  1. array.concat (item...)
    1. 자신의 복사본에 인수로 넘어온 값들을 추가한 새로운 배열을 반환.

    2. 인수로 넘어온 값이 배열이면 각각의 요서를 개별적으로 새로운 배열에 추가.

      var a = [1,2,3];
      var b = [4,5,6];
      var c = a.concat(b, true);
      // c = [1,2,3,4,5,6,true]



  2. array.join (구분자)
    1. 배열의 모든 요소를 합쳐 문자열로 반환
    2. 배열의 각 속성은 구분자로 나뉘어 문자열로 반환된다.
    3. 구분자의 기본값은 , 이다.

    4. 하나의 문자열 (구분자가 없는)로 만들고 싶다면 구분자로 빈 문자열을 지정한다.

      var a = ['a','b','c'];
      var b = a.join('');
      // b = 'abc'



  3. array.pop ()
    1. pop과 push는 배열을 스택처럼 사용할 수 있게 한다.
    2. pop은 배열의 마지막 요소를 제거하고 제거한 요소를 반환한다.

    3. 빈 배열일 경우 'undefined'를 반환한다.

      var a = [1,2,3]
      var c = a.pop();
      // a = [1,2], c = 3;
        
      Array.method ('pop', function () {
          return this.splice(this.length -1, 1)[0];
      });



  4. array.push (item...)
    1. push 메소드는 인수로 넘어온 항목을 배열 끝에 추가한다.

    2. concat과는 다르게 배열 자체를 수정하여 넘어온 인수 전체를 배열에 추가한다.

      var a = ['a', 'b', 'c'];
      var b = ['x', 'y', 'z'];
      var c = a.push(b, true);
      //a = ['a', 'b', 'c', ['x', 'y', 'z'], true] , c = 5
        
      Array.method ('push', function () {
          this.splice.apply (
          this,
          [this.length, 0].
                  concat(Array.prototype.splice.apply(arguments)));
          return this.length;
      });



  5. array.reverse ()

    1. 배열 요소 순서를 반대로 변경한다.

      var a = [1,2,3];
      var b = a.reverse();
      // b = [3,2,1]



  6. array.shift ()
    1. shift 메소드는 배열의 첫 번째 요소를 제거하여 제거한 요소를 반환한다.

    2. pop보다 많이 느리다.

      var a = [1,2,3];
      var c = a.shift();
      // c = 1, a = [2,3]
        
      Array.method('shift', function () {
          return this.shift(0,1)[0];
      });



  7. array.slice (start, end)
    1. slice는 배열 특정 부분에 대한 복사본을 만든다.
    2. start ~ end 까지 해당 첨자의 배열을 복사한다.
    3. end값이 설정되지 않았을 경우 start부터 배열의 마지막까지 복사한다.
    4. start >  array.length라면 빈 배열을 반환한다.

    5. 매개변수가 음수라면 음수 + array.length가 된다.

      var a = [1,2,3];
      var b = a.slice(0, 1); // 1
      var c = a.slice(1); // 2, 3
      var d = a.slice(1, 2); // 3



  8. array.sort (비교함수)
    1. 정렬 시 유니코드 순으로 정렬을 실행한다.
    2. sort 메소드는 숫자를 제대로 정렬하지 못한다. 숫자 또한 문자로 인식하기 때문.

    3. 따라서 다음과 같이 설정을 해주어야 한다.

      n.sort(function (a, b) {
          return a - b;
      });

    4. 다양한 타입의 배열을 정렬하기 위해서

      var m = ['aa', 'bb', 1, 2, 3];
      m.sort(function (a, b) {
          if (a === b) {
          return 0;
          }
          if (typeof a === typeof b) {
          return a < b ? -1 : 1;
          }
          return typeof a < typeof b ? -1 : 1;
      });

    5. 객체 배열을 정렬하기 위해서는

      var by = function (name) {
          return function (o, p) {
          var a, b;
              if (typeof o === 'object' && typeof p === 'object' && o && p) {
                  a = o[name];
                  b = p[name];
                  if (a === b) {
          return 0;
          }
                  if (typeof a === typeof b) {
          return a < b ? -1 : 1;
                  }
                  return typeif a < typeof b ? -1 : 1;
          } else {
                  throw {
                      name : 'Error',
                      message : 'Expected on object when sorting by' + name
          };
          }
          };
      };
    6. sort 메소드는 안정적이지 않다.

    7. 이 실행문은 정확한 실행 흐름에 의한 결과를 보장하지 않는다.

      s.sort(by('first')).sort(by('last'));

    8. 따라서 다중 정렬을 위해

      var by = function (name, minor) {
          return function (o, p) {
              var a, b;
              if (typeof o === 'object' && typeof p === 'object' && o && p) {
                  a = o[name];
                  b = p[name];
                  if (a === b) {
                          return typeof minor === 'function' ? minor(o, p) : 0;
                      }
                  if (typeof a === typeof b) {
                          return a < b ? -1 : 1;
                  }
                  return typeif a < typeof b ? -1 : 1;
              } else {
                  throw {
                      name : 'Error',
                      message : 'Expected on object when sorting by' + name
                      };
              }
          };
      };



  9. array.splice (start, deleteCount, item...)

    1. splice는 기존 배열 요소를 제거하고 그 부분에 새로운 항목으로 대체한다.

      var a = ['a', 'b', 'c'];
      var r = a.splice(1, 1, 'ache', 'bug');
      // a = ['a', 'ache, 'bug', 'c'];
      // r = ['b']



  10. array.unshift (item...)
    1. 배열 앞에 새로운 항목 추가

    2. 배열의 새로운 length를 반환한다.

      var a = ['a', 'b', 'c'];
      var r = a.unshift('?' '@');
      // a = ['?', '@', 'a', 'b', 'c']
      // r = 5

 

 

02 함수

  1. function.apply (thisArg, argArray)

    1. apply메소드는 this에 연결 될 객체 (thisArg)와 (옵션)인수 배열(argArray)을 넘기면서 함수를 호출한다.

      Funtion.method ('bind', function (that) {
          var method = this,
              slice = Array.prototype.slice,
          args = slice.apply(arguments, [1]);
          return function () {
              return method.apply (that,
                  args.concat.slice.apply(arguments, [0])));
          };
      });
        
      var x = function () {
          return this.value;
      }.bind({value : 666});
      alert(x()); //666

 

03 숫자

  1. number.toExponential (fractionDigits)
    1. 숫자를 지수형태의 문자열로 반환

    2. fractionDigits 매개 변수는 소숫점 아래 몇 자리까지 표시할 것인지 지정 ( 0 ~ 20 )

      Math.PI.toExponential(0);
      Math.PI.toExponential(16);
      //3e + 0
      //3.1415926535897930e + 0



  2. number.toFixed (fractionDigits)

    1. 숫자를 고정 소숫점 형태로 반환

      Math.PI.toFixed(0);
      Math.PI.toFixed(16);
      //3
      //3.1415926535897930



  3. number.toPrecision (precision)

    1. 10진수 형태로 변환

      Math.PI.toPrecision(2);
      Math.PI.toPrecision(16);
      //3.1
      //3.1415926535897930



  4. number.toString (radix)
    1. 숫자를 문자열로 변환

    2. radix 매개 변수는 기수 (또는 진법)을 지정할 수 있다. ( 2 ~ 36, default = 10 )

      Math.PI.toString();
      //3.141592653589793



04 객체

  1. object.hasOwnProperty (name)
    1. 객체가 매개변수 name과 같은 이름의 속성이 있으면 참, 아니라면 거짓을 반환한다.
    2. 프로토타입 체인은 확인하지 않는다.

 

05 정규표현식

  1. regexp.exec (string)
    1. string에 일치하는 경우 배열 반환
      1. 배열의 첫 요소는 일치하는 문자열
      2. 두 번째 요소부터는 각 그룹에 캡쳐된 텍스트
    2. g플래그를 사용한 경우
      1. lastIndex부터 검색
      2. 일치하는 문자를 찾는다면 lastIndex를 일치하는 문자 다음에 위치

    3. ^ 부분은 lastIndex가 0일 때만 일치한다.

      while((a = tags.exec(text))) {
          for (i = 0 ; i < a.length ; i++) {
              console.log(('//[' + i + ']' + a[i]).entityify());
          }
      }



  2. regexp.test (string)
    1. regexp가 문자열에 일치하면 참, 아니라면 거짓을 반환

    2. 굉장히 빠르다.

      var b = /&.+;/.test('frank &amp; beans');
      // true



 

06 문자열

  1. string.chatAt (pos)

    1. 문자열에서 pos위치에 있는 문자를 반환

      var name = 'curly';
      var initial = name.charAt(0); // 'c'



  2. string.charCodeAt (pos)

    1. pos위치 문자의 코드를 반환

      var name = 'curly';
      var initial = name.charCodeAt(0); //67



  3. string.cocnat (string)

    1. 인자로 넘어온 문자열을 연결하여 새로운 문자열 생성

      var s = 'c'.concat('a', 't'); //cat



  4. string.indexOf (searchString, position)
    1. 문자열에서 searchString의 첫 시작 위치를 반환

    2. position으로 시작 위치를 지정할 수 있다.

      var text = 'Mississippi';
      var p = text.indexOf('ss', 3); //5



  5. string.lastIndexOf (searchString, position)

    1. 문자열의 시작이 아니라 끝부터 검색

      var text = 'Mississippi';
      var p = text.lastIndexOf('ss', 3); //2



  6. string.localeCompare (that)
    1. 문자열에서 that 문자열 비교.
    2. 문자열이 that보다 적은 경우 음수, 같으면 0, 크면 양수를 반환한다.


  7. string.match (regexp)
    1. 일치하는 (정규표현식과) 부분을 찾는다.
    2. g 플래그가 없다면 regexp.exec와 반환 값이 같다.
    3. g 플래그가 있다면 일치하는 모든 부분을 반환
  8. string.replace (searchValue, replaceValue)
    1. 문자열 대상으로 검색 및 대체 작업 실행.
    2. searchValue는 문자이거나 정규 표현식
      1. 첫 번째 일치하는 문자만 교체한다.
      2. g 플래그 설정 시 일치하는 모든 문자를 교체한다.
    3. replaceValue에 $ 시퀀스를 설정할 수 있다.
      1. $$ => $
      2. $& => 일치하는 텍스트
      3. &숫자 => 해당 숫자의 캡쳐 그룹 텍스트
      4. &` => 일치하는 부분 앞에 있는 텍스트
      5. $' => 일치하는 부분 뒤에 있는 텍스트
      String.method('entityify', function () {
          var character = {
              '<' : '&lt;',
              '>' : '&gt;',
              '&' : '&amp;',
              '"' : '&quot;'
          }
           
          return function () {
              return this.replace(/[<>&"]/g, function (c) {
                  return character[c];
              });
          };
      }());
      alert("<&>".entityify()); // &lt;&amp;&gt;
  9. string.search (regexp)
    1. 정규 표현식을 받는 indexOf
    2. 검색에 성공하면 해당 위치를, 없다면 -1을 반환

    3. g 플래그는 무시한다.

      var text = 'and in he says "any damn fool could';
      var pos = text.search(/["']/); //18



  10. string.slice (start, end)
    1. 배열의 slice와 비슷하게 동작한다.

  11. string.split (separator, limit)
    1. 구분자로 문자열을 쪼개 배열로 반환
    2. g플래그 무시
    3. 구분자 주의점
      1. 캡쳐 그룹에 캡쳐된 텍스트도 결과에 포함된다. p.155
      2. 일부 환경에서 정규 표현식 구분자 사용 시 결과에 빈 문자열 배열이 포함된다.

    4. limit는 나눌 개수

      var digits = '01234';
      var a = digits.split('', 3);
      // [0, 1, 234]



  12. string.substring (start, end)
    1. 음수로 된 매개변수를 변환하지 않는 점을 빼면 slice 메소드와 같다.
    2. slice 메소드가 더 좋다.


  13. string.toLocaleLowerCase ()
    1. 로케일 규칙을 사용하여 문자열을 소문자로 변환한 새로운 문자열을 반환

  14.  string.toLocaleUpperCase ()
    1. 로케일 규칙으로 대문자로 변환

  15. string.toLowerCase ()
    1. 문자열을 소문자로 변환하여 반환.
       
  16.  string.toUpperCase ()
    1. 문자열을 대문자로 변환하여 반환.
       
  17. string.fromCharCode (char...)

    1. 인수로 넘어온 숫자값들을 문자열로 변환하여 반환.

      var a = String.fromCharCode(67, 97, 116);
      // a = 'Cat'

 

 

 




참고문헌

1. 더글라스 크락포드, 김명신  『자바스크립트 핵심가이드 javascript The good parts』, 한빛미디어

저작자표시

'JS > javascript' 카테고리의 다른 글

Chapter9, 부록  (0) 2017.04.09
javascript / Chapter7. 정규 표현식  (0) 2017.02.26
javascript / Chapter6. 배열  (0) 2017.02.26
javascript / Chapter5. 상속  (0) 2017.02.26
javascript / Chapter4. 함수 2  (0) 2017.02.08
공유하기 링크
'JS/javascript' Related Articles more
Comments