자바스크립트 객체와 컬렉션 조작하기

2015. 5. 8. 23:44plming/jQuery

자바스크립트의 String은 처음과 끝에 있는 공백 문자열을 제거하는 메서드를 제공하지 않는다.

 

$.trim( value=String )

전달된 문자열 앞뒤에 있는 공백 문자를 제거하고 결과를 반환한다.

이 함수에 정의된 공백문자는 자바스크립트 정규표현식 '\s'와 일치한다.

이 값은 공백문자뿐 아니라 폼 피드, 개행, 리턴, 탭, 수직 탭 문자와

그 외에도 유니코드 문자인 \u00A0, \u2028, \u2029와도 일치한다.

 

원본 값은 수정되지 않는다.

 

전달하는 매개변수가 문자열인지 여부를 확인하지 않는다.

다른 타입의 값을 전달하면 undefined나 자바스크립트 에러가 발생한다.

 

$('#someField').val( $.trim( $('#someField').val() ) );

 

 

$.each( container=Array|Object, callback=Function )

전달된 컨테이너의 아이템을 순회하면서 아이템마다 전달된 콜백함수를 호출한다.

container : 순회할 아이템을 가진 배열 혹은 프로퍼티를 가진 객체

callback : 컨테이너의 엘리먼트마다 호출되는 함수.

               컨테이너가 배열이면 배열의 아이템마다 호출되고, 객체면 객체의 프로퍼티마다 호출된다.

               첫번째 매개변수는 배열의 인덱스이거나 객체 프로퍼티의 이름.

               함수 콘텍스트(this)는 두번째 매개변수로 설정

 

var anArray = ['a','b','c'];

$.each( anArray, function(n,value) { ... } );

var anObject = {a:1,b:2,c:3};

$.each( anObject, function(name,value) { ... } );

 

※ 배열을 순회할 때 false를 반환하면 반복을 벗어나지만

    객체 프로퍼티를 순회할 때는 그러한 효과가 없다.

 

 

$.grep( array, callback=Function|String, invert=Boolean )

전달된 배열의 엘리먼트마다 콜백 함수를 호출하면서 순회한다.

콜백 함수의 반환값은 $.grep()의 반환값에 포함될지를 결정한다.

invert 매개변수를 생략하거나 false이면 콜백의 값이 true이면 값이 수집된다.

invert가 true이면, 콜백의 값이 false일 경우 수집된다.

 

array : 필터링될 데이터 값을 가진 배열.  이 배열은 변경되지 않는다.

callback : 현재 데이터 값을 수집할지 결정하는 값을 반환하는 함수

               invert가 true가 아니면, true를 반환할 때 결과에 포함

               이 함수는 현재 데이터 값과 원본배열의 인덱스를 매개변수로 전달 받는다.

 

원본 배열은 변경되지 않는다.

필터링 하는 조건은 정규 표현식이 아니다.

 

콜백이 문자열이면,

전달된 문자열을 return구문의 값으로 사용한 두 매개변수를 가진 콜백 함수를 자동으로 생성한다.

var bigNumbers = $.grep(originalArray, 'a>100');

요롷게 생성한다. function(a,i) { return a>100; }

 

 

String 클래스의 match() 메서드를 사용하여 (정규식)패턴과 일치하는 값을 확인할 수 있다.

return value.match( /^\d{5}(-\d{4})?$/) != null;

 

 

$.map( array=Array, callback=Function|String )

전달된 배열의 아이템마다 콜백 함수를 호출하면서 순회하며,

함수 호출로 반환된 값은 새로운 배열로 수집된다.

 

array : 새로운 배열로 변환될 값을 가진 배열

callback : $.map()함수 호출의 결과로 반환될 새 배열에 수집되는 반환값을 가진 함수.

              이 함수에 매개변수가 두 개 전달된다.

              각각은 현재 데이터 값원본 배열에서의 인덱스다.

              콜백 함수로 변환될 문자열도 전달할 수 있다.

 

var oneBased = $.map( [0,1,2,3,4], function(value){ return value+1; } );

 

구문을 간단하게 만드는 표현식 형태의 문자열을 전달할 수 있다.

var oneBased = $.map( [0,1,2,3,4], 'a+1' );

 

함수가 null이나 undefined를 반환하면, 결과가 수집되지 않는다.

 

변환 함수가 배열을 반환할 때, 반환된 값을 결과로 반환할 배열에 합칠수 있다.

var characters = $.map(

     ['this', 'that', 'other thing'],

     function(value){ return value.split(''); }

);

characters의 값은 ['t','h','i','s','t','h','a','t','o','t','h','e','r',' ','t','h','i','n','g']

 

 

https://msdn.microsoft.com/library/66ztdbe6(v=vs.94).aspx

isNaN('S') : 문자열에서 숫자로 변환해본 결과를 확인

                  숫자형 문자면 false, 문자형 문자면 true

 

 

$.inArray( value=Object, array=Array )

array에서 value값이 처음 나타나는 위치 인덱스를 반환

var index = $.inArray( 2, [1,2,3,4,5] );

 

 

$.makeArray( object )

NodeList 같은 유사 배열 객체를 자바스크립트 배열로 변환

 

 

$.unque( array=Array )

DOM 엘리먼트의 배열이 주어지면,

원본 배열에서 고유한 엘리먼트로만 구성된 배열을 반환

 

 

$.extend( target=Object, source1, source2, ...sourceN )

target에 전달된 객체를 함께 전달된 나머지 객체의 프로퍼티를 사용하여 확장

 

target : 원본 객체의 프로퍼티를 복사하여 프로퍼티가 증가한 객체.

           이 객체는 함수의 반환값으로 반환되기 전에 새로운 프로퍼티로 직접 수정된다.

           원본 객체의 프로퍼티와 이름이 동일한 프로퍼티는 원본 엘리먼트의 값을 재정의된다.

 

source1, ...sourceN : target 객체에 추가되는 프로퍼티를 가진 두 개 이상의 객체.

                               원본 객체가 하나 이상 제공되고 객체들 안에 이름이 동일한 프로퍼티가 있을 때,

                               인수 목록에서 뒤에 나오는 원본 객체의 프로퍼티가

                               목록의 앞에 있는 원본 객체보다 우선한다.

 

var target     = { a: 1, b: 2, c: 3 };

var source1 = { c: 4, d: 5, e: 6 };

var source2 = { e: 7, f: 8, g: 9 };

$.extend( target, source1, source2 );

결과는 { a: 1, b: 2, c: 4, d: 5, e: 7, f: 8, g: 9 }