[자바스크립트] TIL4 : 스트링 메서드를 이용한 문자열 처리 / 매스 객체를 이용한 수학적 연산

---

▣ 스트링 메서드 (String Methods)

아래의 코드를 통해 파악할 수 있듯이 string 자료형을 다루기 위한 특성 및 메서드들은 다양한 기능을 포함하고 있습니다. 그중에서 대표적인 몇 가지를 살펴보겠습니다.

 

---

□ 스트링 메서드 예시1

const firstName = "Jerry";
const lastName = "Maguire";
const age = 30;

/* Escape Sequence */
console.log("That's awesome, I can't wait.");
console.log('That\'s awesome, I can\'t wait.');

/* length : property */
console.log(firstName.length);

/* Concatenate */
console.log("My name is " + firstName + " and I am " + age + ".");

/* Append */
let fullName = "John ";
// console.log(fullName = fullName + "Doe");
console.log(fullName += "Doe");

/* concat() : method */
console.log(firstName.concat(" " + lastName));
console.log(firstName.concat(" ", lastName));

/* Change case */
console.log(firstName.toUpperCase());
console.log(firstName.toLowerCase());

/* indexOf() : method */
console.log(firstName.indexOf("r"));
console.log(firstName.lastIndexOf("r"));
console.log(firstName.indexOf("x")); // -1

 

▷ Escape Sequence

이스케이프 시퀀스는 자료형과는 별개로 사용되는 특별한 문자들로써 작은 따옴표(\'), 큰 따옴표(\"), 줄 바꿈(\n), 리턴키(\r), 탭키(\t), 역 슬래쉬(\\) 등을 문자열 내에서 표현하고자 할 때 사용합니다. 

 

▷ length

메서드는 아니지만 string 자료형의 가장 대표적인 특성으로써 구성하고 있는 문자들의 개수(공백 포함)를 정수의 값으로 가집니다.

 

▷ 문자열 연결(Concatenation) 또는 붙임(Append)

'+' 기호를 이용하여 두 문자열을 연결하거나 기존의 문자열에 다른 문자열을 이어 붙일 수 있습니다.

 

▷ concat()

'+' 기호와 마찬가지로 문자열을 연결하는 역할을 하는 메서드입니다. 여기에서 유의해야 할 점은 대상이 되는 문자열을 변경하는 것이 아니라 메서드 실행의 결과로써 새로운 문자열을 생성하여 반환한다는 것입니다.

 

▷ toUpperCase(), toLowerCase()

문자열의 모든 문자들을 대문자 또는 소문자로 바꾸는 메서드입니다. concat()과 마찬가지로 대상 문자열을 대문자나 소문자로 바꾸는 것이 아니라 대문자나 소문자의 형태를 가진 새로운 문자열을 생성하여 반환합니다. 

 

▷ indexOf(), lastIndexOf()

문자열을 구성하고 있는 부분 문자(열)들 중에 특정 문자(열)가 괄호 안에 인자로 주어질 경우 해당 인덱스(문자열일 경우 첫 번째 문자의 인덱스) 값을 반환하는 메서드입니다. 단 동일한 문자(열)가 여러 개 있을 경우 indexOf() 는 첫 번째 인덱스 값을, lastIndexOf()는 마지막 인덱스 값을 반환합니다. 그리고 주어진 부분 문자(열)가 대상 문자열 중에 없을 경우에는 '-1' 을 반환합니다.

 

---

□ 스트링 메서드 예시2

// 위의 코드에 계속 이어서
/* charAt() : method */
console.log(firstName.charAt(1));
console.log(firstName.charAt("1"));
console.log(firstName[1]);
console.log(firstName.charAt(firstName.length - 1));
console.log(firstName.charAt(5)); // ''

/* substring() : method */
console.log(firstName.substring(0, 3));

/* slice() : method */
console.log(firstName.slice(0, 3));

/* split() : method */
console.log(firstName.split(""));
console.log(fullName.split(" "));
const str = "Hello there my name is Young.";
const tags = "web design, web developmet, programming";
console.log(str.split(" "));
console.log(tags.split(", "));

/* replace() : method */
console.log(str.replace("Young", "Charlie"));

/* includes() : method */
console.log(str.includes("Hello"));
console.log(str.includes("foo"));

 

▷ charAt()

indexOf()의 경우와 반대로 문자열의 특정 인덱스 값이 괄호 안에 인자로 주어질 경우 해당 문자를 반환하는 메서드입니다. 다만 실제로는 배열의 경우와 마찬가지로 '[ ]'을 주로 이용하기 때문에 자주 사용되지는 않습니다. 

 

▷ substring()

문자열의 일부분을 잘라낼 수 있는 메서드입니다. 괄호 안의 첫 번째 인자는 시작 인덱스이고 두 번째 인자는 끝 인덱스이며, 이때 시작 인덱스에 해당되는 문자는 반환되는 문자열에 포함되고 끝 인덱스에 해당되는 문자는 포함되지 않습니다. 또한 반환되는 문자열은 새롭게 생성된 문자열입니다.

 

▷ slice()

위의 substring()과 동일한 역할을 하며, 마찬가지로 반환되는 문자열은 대상 문자열을 변경한 것이 아닌, 새롭게 생성된 문자열입니다.

 

▷ split()

괄호 안에 인자로 주어지는 문자(열)를 기준(공백 또는 공백 없음도 포함)으로 대상 문자열을 잘라서, 각 부분들을 모두 요소로 가지는 배열로 반환하는 메서드입니다. 즉 기존의 문자열에는 변화가 없습니다.

 

▷ replace()

괄호 안에 첫 번째 인자로 주어지는 문자(열)를 대상 문자열에서 찾아 두 번째 인자로 주어지는 문자(열)로 바꾸는 메서드입니다. 이때 대상이 되는 문자열은 변경되지 않으며, 반환되는 문자열은 새롭게 생성된 문자열입니다.

 

▷ includes()

괄호 안에 인자로 주어지는 문자(열)가 대상 문자열 중에 포함되어 있으면 true, 없으면 false를 반환하는 메서드입니다. 기능만 보면 indexOf()와 유사한데, 다만 참, 거짓만을 알려주는 것이 다른 점입니다.

  

 

직접 코드를 작성해 보고 결과를 확인하기 바랍니다. 

 

 

---

반응형

---

 

▣ 숫자 데이터의 산술 연산

/* Simple arithmethic */
const num1 = 100;
const num2 = 50;

console.log(num1 + num2);
console.log(num1 - num2);
console.log(num1 * num2);
console.log(num1 / num2);
console.log(num1 % num2);

 

자바스크립트에서도 숫자로 된 데이터를 이용하여 각종 계산(수학적 연산)이 가능합니다. 이때 사용되는 기호는 수학 기호와 유사한데, 덧셈과 뺄셈은 동일하고, 곱셈과 나눗셈은 약간 다릅니다. 그리고 나눗셈의 나머지를 구하는 기호(%)도 있습니다.

 

 

---

 

▣ 매스 객체(Math Object)를 이용한 수학적 연산

/* Math Object */
console.log(Math.PI);
console.log(Math.E);

console.log(Math.round(12.5));
console.log(Math.ceil(12.3));
console.log(Math.floor(12.5));

console.log(Math.sqrt(9));
console.log(Math.abs(-5));
console.log(Math.pow(2, 3));
console.log(Math.min(1, 2, 3));
console.log(Math.max(1, 2, 3));

console.log(Math.random());
console.log(Math.random() * 10);
console.log(Math.random() * 100);

// ex) 1 ~ 20 사이의 임의의 정수를 얻고자 할 때
console.log(Math.floor(Math.random() * 20 + 1));

 

매스 객체는 주로 number 자료형을 더욱 다양하게 활용하기 위한 여러 가지 수학적 기능을 포함하고 있습니다. 파이(PI)나 오일러 상수(E)와 같은 특정 값을 나타내거나 반올림(round), 올림(ceil), 그리고 내림(floor) 연산을 할 수 있으며 제곱근 값(sqrt), 절댓값(abs), 제곱 값(pow), 최솟값(min), 최댓값(max) 등을 구할 수도 있습니다.

특히 0과 1 사이(0 이상 1 미만)의 임의의 실수를 얻을 수 있는 Math.random() 메서드는 특정 범위 내에 있는 임의의 정수를 얻거나 배열의 요소 중 임의의 요소를 얻고자 할 때 유용합니다. 

 

 

---