728x90

✨ string의 양쪽 공백을 모두 없애주는 build-in method

💻Example Code

실행 결과

🧨 Client에게 무언가 입력을 받은 후 실수로 채워진 공백을 지울 때 유용하게 사용 가능하다.

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/trim

 

String.prototype.trim()

The trim() method removes whitespace from both ends of a string. Whitespace in this context is all the whitespace characters (space, tab, no-break space, etc.) and all the line terminator characters (LF, CR, etc.).

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

Array.prototype.find()  (0) 2020.06.09
Array.prototype.splice()  (2) 2020.05.15
String.prototype.charAt()  (0) 2020.02.22
Set (Object)  (0) 2020.02.20
String.prototype.localeCompare()  (0) 2020.02.20
728x90

✨ testing function의 결과로 나온 array 중 첫 번째 값(value)을 반환하는 build-in method

💻Example Code

실행 결과

🧨 DOM에서 원하는 node를 찾고자 할 때 유용하게 사용할 수 있다.

실전 예제

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

 

Array.prototype.find()

The find() method returns the value of the first element in the provided array that satisfies the provided testing function.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

String.prototype.trim()  (2) 2020.08.10
Array.prototype.splice()  (2) 2020.05.15
String.prototype.charAt()  (0) 2020.02.22
Set (Object)  (0) 2020.02.20
String.prototype.localeCompare()  (0) 2020.02.20
728x90

✨ Array의 특정 index를 지정하여 제거하거나 삽입할 수 있는 build-in method

💻Example Code

실행 결과

🧨 splice(시작 index, option, 값) 의 형식으로 사용할 수 있으며,
option에 0을 지정하면 삽입, 1을 지정하면 제거(변경) 효과를 볼 수 있다.
또한, splice(0)을 이용하면 해당 array의 모든 값을 제거하는 효과를 볼 수 있다.

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

 

Array.prototype.splice()

The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

String.prototype.trim()  (2) 2020.08.10
Array.prototype.find()  (0) 2020.06.09
String.prototype.charAt()  (0) 2020.02.22
Set (Object)  (0) 2020.02.20
String.prototype.localeCompare()  (0) 2020.02.20
728x90

✨ String의 인덱스를 지정하는 또 다른 방법

💻Example Code

실행 결과

🧨 물론 직접 지정하는 것도 가능하지만, 조금 더 graceful 표현이 필요할 때, 또는 목적에 맞게 사용 가능하다.
프로젝트는 보통 다수의 인원이 참여하게 되는데, 내 코드를 다른 사람도 이해할 수 있어야 한다.
따라서, 내가 작성한 코드의 목적을 정확히 표현하고 싶을 때 사용할 수 있다.

👉 자세한 내용https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charAt

 

String.prototype.charAt()

The String object's charAt() method returns a new string consisting of the single UTF-16 code unit located at the specified offset into the string.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

Array.prototype.find()  (0) 2020.06.09
Array.prototype.splice()  (2) 2020.05.15
Set (Object)  (0) 2020.02.20
String.prototype.localeCompare()  (0) 2020.02.20
Math.round()  (0) 2020.02.16
728x90

✨ 유일한(unique)값을 얻고 싶을 때 사용할 수 있는 Built-in Object

💻Example Code

실행 결과

🧨 중복된 값이 여러 개 존재할 때 유용하게 사용 가능하다.

👉 자세한 내용https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

Array.prototype.splice()  (2) 2020.05.15
String.prototype.charAt()  (0) 2020.02.22
String.prototype.localeCompare()  (0) 2020.02.20
Math.round()  (0) 2020.02.16
Math.abs()  (0) 2020.01.28
728x90

✨ 문자의 정렬 순서를 비교를 통해 알아낼 수 있는 helper method

💻Example Code

 

 

실행 결과

🧨
의 비교 문자가의 비교 문자보다 정렬 순서가 앞이라면 -1
의 비교 문자가 의 비교 문자보다 정렬 순서가 같다면 0
의 비교 문자가 의 비교 문자보다 정렬 순서가 뒤라면 1
이 출력되는 것을 확인할 수 있다.

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare

 

String.prototype.localeCompare()

The localeCompare() method returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

String.prototype.charAt()  (0) 2020.02.22
Set (Object)  (0) 2020.02.20
Math.round()  (0) 2020.02.16
Math.abs()  (0) 2020.01.28
Math.PI  (0) 2020.01.28
728x90

✨ 반올림이 필요할 때 사용하는 helper method

💻Example Code

 

실행 결과

🧨 반올림이 필요할 경우에 사용할 수 있다.

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round

 

Math.round()

The Math.round() function returns the value of a number rounded to the nearest integer.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

Set (Object)  (0) 2020.02.20
String.prototype.localeCompare()  (0) 2020.02.20
Math.abs()  (0) 2020.01.28
Math.PI  (0) 2020.01.28
Array.prototype.forEach()  (0) 2020.01.23
728x90

✨ 절대값을 이용한 계산이 필요할 때 사용할 수 있는 helper method

💻Example Code

const x1 = 5;
const x2 = 3;

console.log(x2-x1);
console.log(x1-x2);
console.log(Math.abs(x2-x1));
console.log(Math.abs(x1-x2));

🧨 두 점 사이의 거리 등 다양한 계산에서 활용할 수 있다.

👉 자세한 내용은 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Math/abs

 

Math.abs()

Math.abs() 함수는 주어진 숫자의 절대값을 반환합니다.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

String.prototype.localeCompare()  (0) 2020.02.20
Math.round()  (0) 2020.02.16
Math.PI  (0) 2020.01.28
Array.prototype.forEach()  (0) 2020.01.23
Math.pow()  (0) 2020.01.22
728x90

✨ PI(파이)를 이용한 계산이 필요할 때 사용할 수 있는 helper method

💻Example Code

const radius = 2
const areaOfCircle = radius * radius * Math.PI;

console.log( areaOfCircle );
console.log( Math.PI );

실행 결과

🧨 원의 넓이를 구하는 공식: 반지름*반지름*PI(파이)

😋 소수점 아래를 조정하고 싶다면 toFixed()를 사용해주면 된다. 링크 참고(https://dpsc615.tistory.com/14)

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI

 

Math.PI

The Math.PI property represents the ratio of the circumference of a circle to its diameter, approximately 3.14159:

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

Math.round()  (0) 2020.02.16
Math.abs()  (0) 2020.01.28
Array.prototype.forEach()  (0) 2020.01.23
Math.pow()  (0) 2020.01.22
Math.random()  (0) 2020.01.18
728x90

배열(array)의 값(element)을 하나씩 받아서 내가 작성한 function을 실행해주는 helper method

💻Example Code

const arr = [ 1, 2, 3 ];

const received = arr.forEach( num => console.log(num) );

console.log( arr );
console.log( received );

실행 결과

forEach는 제공 받은 function Array의 각 element마다 실행해주기만 한다.
function의 결과를 return 해주지 않는다. forEach의 return 값은 undefined다.

따라서 위의 결과처럼, arr를 한 번씩 실행해주고 있는 것을 볼 수 있으며, 기존 arr값이 변하지 않는 것을 볼 수 있다.
또한, return값이 있는지 확인하기 위해 선언했던 received를 출력하면 undefined가 출력되는 것을 볼 수 있다.

🎃실전 예제

forEach를 사용하여 ul에 li element를 추가해주는 예제
위의 예제가 실행된 HTML 페이지

위의 간단한 예제처럼 사용할 수 있다. objArr는 직접 작성해줬지만, 어딘가에서 받아올 data라 생각하면 된다.

😋 개발을 진행할 때, 많은 양의 데이터를 받아와서 하나씩 실행해줄 때 매우 유용하다.
매우 자주 쓰이는 helper method이므로 필수적으로 알고 있어야 한다.

👉 자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

 

Array.prototype.forEach()

The forEach() method executes a provided function once for each array element.

developer.mozilla.org

 

'JavaScript > Built-in Method etc.' 카테고리의 다른 글

Math.abs()  (0) 2020.01.28
Math.PI  (0) 2020.01.28
Math.pow()  (0) 2020.01.22
Math.random()  (0) 2020.01.18
Math.ceil()  (0) 2020.01.18

+ Recent posts