표준 내장 객체 (Javascript)

January·2022년 4월 28일
0

Frontend

목록 보기
10/31
post-custom-banner

String

String 전역 객체는 문자열(문자의 나열)의 생성자이다. 텍스트 문자열의 길이 찾기, 문자열 합치기 및 쪼개기 등과 같은 내장된 메서드를 사용하여 문자열에서 수행할 수 있는 유용한 작업이 가능하다.

String.length

문자열의 길이를 나타낸다.

const str = 'Hello World'
str.length
console.log(str.length)

String.prototype.includes()

하나의 문자열이 다른 문자열에 포함되어 있는지를 판별하고 결과를 Boolean데이터로 반환한다.

const str = 'Hello World'
console.log(str.includes('World'))  // True

String.prototype.indexOf()

호출한 String 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환한다. 일치하는 값이 없으면 -1을 반환한다.

const str = 'Hello World'
console.log(str.indexOf('Hello'))  // 0

String.prototype.match()

문자열이 정규식과 매치되는 부분을 검색한다.

const str = 'Hello World'
str.match(/^.*(?=\s)/gi)[0]  // ['H']

String.prototype.replace()

일부 또는 모든 부분이 교체된 새로운 문자열을 반환한다. 대체하거나 삭제용도로 쓸 수 있다.

const str = 'Hello World'
console.log(
  str.replace('World', 'loolu')  // Hello loolu
)

String.prototype.slice()

문자열의 일부를 추출하면서 새로운 문자열을 반환한다.

const str = 'Hello World'
console.log(
  str.slice(0,4)
)     //  Hell

String.prototype.split()

String 객체를 지정한 인자를 이용하여 여러 개의 문자열로 나눈다.

const str = 'Hello World'
console.log(
  str.split(' ')  
)    // ['Hello', 'World']

String.prototype.toUpperCase()

문자열을 대문자로 변환해 반환한다.

const str = 'Hello World'
console.log(
  str.toUpperCase()
)

String.prototype.toLowerCase()

문자열을 소문자로 변환해 반환한다.

const str = 'Hello World'
console.log(
  str.toLowerCase()
)

String.prototype.trim()

문자열 양 끝의 공백을 제거합니다. 웹페이지 로그인할때 주로 쓰이는 메소드이다.

const str = ' Hello World     '
console.log(
  str.timr() 
)

Number

문자열이나 다른 값을 Number 타입으로 변환한다. 만약 만약 인수를 숫자로 변환할 수 없으면 NaN을 리턴한다.

Number.prototype.toFixed()

숫자를 소수점 몇번째 자리까지 표시한다.

const num = 3.141592653589
num.toFixed(2) // 3.14

Number.NaN

Not-A-Number(숫자가 아님)를 나타낸다.

const num = 3.141592653589
num * undefined  // NaN

Number.isNaN()

주어진 값이 NaN인지 판별하고 Boolean 데이터로 반환된다.
(isNaN()은 강제로 매개변수를 숫자로 변환하는 문제가 있다. Number.isNaN()으로 표기해야한다.)

const num = 3.141592653589
Number.isNaN(num * undefined )  // true

Number.parseInt()

문자열 인자를 파싱하여 정수만 반환한다.

const num = 3.141592653589
parseInt(num) // 3

Number.parseFloat()

문자열 인자를 파싱하여 실수로 반환한다.

const num = 3.141592653589
parseFloat(num) // 3.141592653589

Math

수학적인 상수와 함수를 위한 속성과 메서드를 가진 내장 객체이다. 다른 전역 객체와 달리 Math는 생성자가 아니다. Math의 모든 속성과 메서드는 정적이다.

Math.abs()

주어진 숫자의 절대값을 반환한다.

const num = -7
Math.abs(num) // 7

Math.ceil()

주어진 숫자보다 크거나 같은 숫자 중 가장 작은 숫자를 정수로 반환한다.

const num = 0.45
Math.ceil(num) // 1

Math.round()

입력값을 반올림한 수와 가장 가까운 정수 값을 반환한다.

const num = 0.45
Math.round(num) // 0

Math.floor()

주어진 숫자와 같거나 작은 정수 중에서 가장 큰 수를 반환한다.

const num = 0.45
Math.floor(num) // 0

Math.min()

인수로 들어오는 숫자들 중 가장 작은 값을 반환한다.

Math.min(0, 1, 99, 102, 7, 2)  // 0

Math.max()

입력값으로 받은 0개 이상의 숫자 중 가장 큰 숫자를 반환한다.

Math.max(0, 1, 99, 102, 7, 2)  // 102

Math.random()

0 이상 1 미만의 구간에서 근사적으로 균일한 소숫점 난수를 반환한다. 이 값은 사용자가 원하는 범위로 변형 가능하다.

Math.random()  // 0.xxxxxx

function getRandom() {
  return Math.floor(Math.random() * (max -min)) + min 
}
getRandom(0, 99) // 0~99의 랜덤한 수를 출력

Array

리스트 형태의 고수준 객체인 배열을 생성할 때 사용하는 전역 객체이다.

Array.length

배열의 길이를 반환한다.

const arr = [1, 2, 3, 4]
arr.lenth  // 4

Array.prototype.concat()

인자로 주어진 배열이나 값들을 기존 배열에 합쳐서 새 배열을 반환한다. 기존 배열이 수정되지 않는다.

const arr = [1, 2, 3, 4]
arr.concat([4, 5, 6])  // [1, 2, 3, 4, 4, 5, 6]

Array.prototype.every()

배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트한다. Boolean 값을 반환한다.

const arr = [1, 2, 3, 4]
arr.every(item => {
  return item < 5   //모든 요소들이 5보다 작니?
})   // true

// 축약
const arr = [1, 2, 3, 4]
arr.every(item => item < 5)

Array.prototype.filter()

주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다. 기존 배열이 수정되지 않는다.

const arr = [1, 2, 3, 4]
arr.filter(item => {
  return item <3
}) // [1, 2]

Array.prototype.find()

주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환한다. 그런 요소가 없다면 undefined를 반환한다.

const arr = [1, 2, 3, 4]
arr.find(element => {
  return element < 3
}) // 1

// 응용
const arr = [
  { name: 'loo' },
  { name: 'luu' }
]
arr.find(element => {
  return element === 'loo'
}) // { name: 'loo' }

Array.prototype.findIndex()

주어진 판별 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환한다. 만족하는 요소가 없으면 -1을 반환한다.

const arr = [1, 2, 3, 4]
arr.findIndex(element => {
  return element === 3
})  // 2

Array.prototype.forEach()

주어진 함수를 배열 요소 각각에 대해 실행한다.

const arr = [1, 2, 3, 4]
arr.forEach(item => {
  console.log(item)
})  // 1, 2, 3, 4

Array.prototype.includes()

배열이 특정 요소를 포함하고 있는지 판별한다.

const arr = [1, 2, 3, 4]
arr.includes(3)  // true

Array.prototype.join()

배열의 모든 요소를 연결해 하나의 문자열로 만든다.

const arr = [1, 2, 3, 4]
arr.join('//') // 값은 1//2//3//4

Array.prototype.map()

배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다. 기존 배열이 수정되지 않는다.

const arr = [1, 2, 3, 4]
arr.map(item => {
  return item * 2
}) // [2, 4, 6, 8]

const arr = [1, 2, 3, 4]
arr.map((item,index) => {
  console.log(index)
  return item * 2
}) // [2, 4, 6, 8] , 0, 1, 2, 3

Array.prototype.pop()

배열에서 마지막 요소를 제거하고 그 요소를 반환한다.

const arr = [1, 2, 3, 4]
arr.pop() // 4

Array.prototype.shift()

배열에서 첫 번째 요소를 제거하고, 제거된 요소를 반환한다. 기존 배열이 수정된다.

const arr = [1, 2, 3, 4]
arr.shift() // 1

Array.prototype.push()

배열의 끝에 하나 이상의 요소를 추가한다. 기존 배열이 수정된다.

const arr = [1, 2, 3, 4]
arr.push(99, 7, 2623) // 7

Array.prototype.unshift()

새로운 요소를 배열의 맨 앞쪽에 추가한다. 기존 배열이 수정된다.

const arr = [1, 2, 3, 4]
arr.unshift(99, 7, 2623) // 7

shift <-------------> pop 제거하고 제거된 요소 반환.
unshift <-------------> push 추가하고 추가한 요소 반환.

Array.prototype.reduce()

배열의 각 요소에 대해 주어진 함수를 실행하고, 하나의 결과값을 반환한다.

reduce 함수는 네 개의 인자를 가진다.

  1. 누산기 (acc)
  2. 현재 값 (cur)
  3. 현재 인덱스 (idx)
  4. 원본 배열 (src)
const arr = [1, 2, 3, 4]
arr.reduce((acc, cur) => {
  return acc + cur
}, 0) // 10

const arr = [1, 2, 3, 4]
arr.reduce((acc, cur, idx) => {
    console.log(idx)
    return acc + cur
  }, 0)  // 0, 1, 2, 3, 10

콜백이 4번 반복한다. acc는 누적되는 값인데 초기값으로 0을 가져간다. cur은 초기값을 가져가지 않아서 객체 데이터 처음 값(1)을 가져온다.

원래 콜백은 개별적으로 실행되는데 리듀스는 누적값을 다음 콜백으로 넘겨줄수있다.

Array.prototype.reverse()

배열의 순서를 반전한다. 첫 번째 요소는 마지막 요소가 되며 마지막 요소는 첫 번째 요소가 된다. 기존 배열이 수정된다.

const arr = [1, 2, 3, 4]
arr.reverse() //[4, 3, 2, 1]

Array.prototype.slice()

어떤 배열의 begin부터 end직전까지 얕은 복사본을 새로운 배열 객체로 반환한다. 기존 배열이 수정되지 않는다.

const arr = [1, 2, 3, 4]
arr.slice(0, 3) //[1, 2, 3]

Array.prototype.some()

배열 안의 어떤 요소가 최소 하나 이상 통과했을 때 Boolean 데이터로 반환한다.

const arr = [1, 2, 3, 4]
arr.some(item => {
  return item === 1
}) //true

Array.prototype.splice()

배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가한다. 기존 배열이 수정된다.

const arr = ['a', 'b', 'c', 'd']
arr.splice(2, 2, 'x') // ['c', 'd']
post-custom-banner

0개의 댓글