Frontend/Javascript

알면 유용하게 쓸 수 있는 객체 함수 모음

간지나제 2021. 3. 13. 00:23

○ sort()

.배열에서 쓰인다.

.ex) const a = ['a', 'c', 'b', 'd'];

     a.sort(); => ['a', 'b', 'c', 'd'];

.ex) const b = ["10000", "4", "3", "6", "1"];

 

○ localeCompare()

.문자열 비교

.class형이나 함수의 여러 필드와 비교할 때 문자열을 비교해야하는 경우가 있는데

 그 때 크기를 비교할 수도 있겠지만 (<, >)

 b.sort((a, b) => a.localeCompare(b));  => ["1", "10000", "3", "4", "6"]

 여기는 그냥 sort로 해도 같은 결과가 나온다.

 문자열 sort이기 때문에.

 

○ reverse()

.배열에서 쓰인다.

.순서를 반대로 바꿔준다.

 

○ split(pattern)

.문자열을 pattern으로 구분해서 배열로 만들어준다.

.ex) 'abcdefg'.split(''); => ["a", "b", "c", "d", "e", "f", "g"]

 

○ join(pattern)

.배열을 string으로 만드는데 그 사이에 pattern을 넣을 수 있다.

.ex) ["a", "b", "c", "d", "e", "f", "g"].join('') => "abcdefg"

 

○ reduce(function(accumulator, currentValue, currentIndex, array) {})

.보통 배열의 합을 구할 때 많이 사용하는 것 같다.

.ex) var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {

        return accumulator + currentValue;

      }, 0);

 

○ match(regex)

.문자열에서 정규표현식에 해당하는 문자를 배열로 리턴해준다.

.ex) 'abcd35123'.match(/[a-z]/g) => ["a", "b", "c", "d"]

 

○ map()

.배열에서 사용되며 간단한 for문의 역할이라고 볼 수 있다.

.ex) ["a", "b", "c", "d", "e", "f", "g"].map(data => data + '1'); => ["a1", "b1", "c1", "d1", "e1", "f1", "g1"]

 

○ filter()

.배열에서 사용되며 filter에 해당하는 것들만 배열로 반환한다.

.ex) ["a", "b", "c", "d", "e", "f", "g"].filter(data => data !== 'a');  => ["b", "c", "d", "e", "f", "g"]

 

○ replace()

.기본적으로 해당하는 첫 번째 문자열을 다음 문자열로 바꿔준다. 

.ex) 'abcdefgabc'.replace('abc', 'ddd'); => ddddefgabc"

.정규표현식에 해당하는 문자도 바꿀 수 있다.

.ex) 'abcd1234'.replace(/[a-z]/g, '3') => 33331234"

 

toUpperCase()

.string객체의 소문자를 대문자로 바꿔준다.

.ex) 'abcd35123'.toUpperCase(); => ABCD35123

 

toLowerCase()
.string객체의 소문자를 소문자로 바꿔준다.

.ex) 'ABCD35123'.toUpperCase(); => abcd35123

 

String.fromCharCode()

.ascii표를 참고하여 해당 숫자에 해당하는 문자(char)를 반환한다.

.ex) String.fromCharCode(89); => "Y"

 

charCodeAt()

.문자의 ascii표에 해당하는 숫자를 반환한다.

.ex) 'a'.charCodeAt(); => 97

 

 toString(num)

.해당 숫자의 num진수를 반영한다.

.ex) let t = 20;

      t.toString(2);  => "10100"

       t.toString(3); => 202"

'Frontend > Javascript' 카테고리의 다른 글

Event Bubbling/Capturing  (0) 2021.03.09
Promise란?  (0) 2021.03.09
Function  (0) 2021.02.23