[JavaScript] 프로퍼티와 메서드 : split(), join(), 배열 값 앞 뒤에 추가, 수학 연산 메서드 Math, 문자열 숫자로 변환

프로퍼티와 메서드에 대해서는 아래 포스팅의 객체(Object) 파트를 참고하자.

2023.08.07 - [Programming language/JavaScript] - [JavaScript] 데이터 타입

[JavaScript] 데이터 타입

문자열 프로퍼티와 메서드

const str1 = "Hello World";

str1.toUpperCase();	// HELLO WORLD. 모든 알파벳 대문자로 바꿔줌.

str1.length;	// 11. 문자열 길이 (공백 포함)
str1.charAt(0);	// H. ()안의 index 값에 해당하는 문자열 추출
str1.split(" ");	// ["Hello","World"]
// split()의 괄호 안에 있는 것은 구분자(separator). 구분자로 문자열을 잘라 배열로 저장.

split() 메서드

문자열을 일정한 구분자로 잘라 배열로 반환해 주는 메서드.

• split() : 길이가 1인 배열 반환
• split(separator) : separator는 문자열을 나누는 기준이 되는 문자열. separator로 문자열을 잘라 배열로 반환.
• split(separator, limit) : limit은 반환되는 배열의 최대 크기를 정하는 정수.

const str = "010-1234-5678";

splits1 = str.split();
console.log(splits1);	// ["010-1234-5678"]
console.log(splits1.length);	// 1

splits2 = str.split("");
console.log(splits2);	//["0", "1", "0", "-", "1", "2", "3", "4", "-", "5", "6", "7", "8"]
console.log(splits1.length);	// 13

splits3 = str.split("-");
console.log(splits3);	// ["010", "1234", "5678"]
console.log(splits1.length);	// 3

splits4 = str.split("-",2);
console.log(splits4);	// ["010", "1234"]
console.log(splits1.length);	// 2

// 블로그 주소에서 id를 추출해보자
const myBlog = "https://hyrmzz1.tistory.com";

const result1 = myBlog.split("/");	// ['https:', '', 'hyrmzz1.tistory.com']
const result2 = result1[2].split(".");	// ['hyrmzz1', 'tistory', 'com']
console.log(result2[0]);

// result1, result2 사용하지 않고 한번에 작성 가능
const id = myBlog.split("/")[2].split(".")[0];
console.log(id);

배열 프로퍼티와 메서드

const alphabet = ["a", "b", "c"];

alphabet.length;	// 3. 배열 데이터 개수 (배열 객체의 길이)

alphabet.push("d");	// 배열 맨 뒤에 데이터 삽입.
alphabet.unshift(" ");	// 배열 맨 앞에 데이터 삽입.
alphabet.pop();	// 배열 맨 뒤의 데이터 제거.
alphabet.shift();	// 배열 맨 앞의 데이터 제거.

join() 메서드

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

() 안에 separator가 들어가며, separator는 배열의 각 요소 사이에 추가됨. 마지막 요소 뒤에는 추가 X.

separator 생략 시 구분자는 쉼표가 됨.

배열을 변형하지 않고 새로운 문자열을 반환 => arr.join(); 후에도 arr는 join() 메서드 사용 전과 같은 상태.

const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());	// "Fire,Air,Water"
console.log(elements.join(", "));	// "Fire, Air, Water"
console.log(elements.join(''));	// "FireAirWater"
console.log(elements.join('-'));	// "Fire-Air-Water"

// 특정 문자를 다른 문자로 바꾸기
const address = '서울시-마포구-동교동';

const names = address.split('-');
console.log(names);	// ['서울시', '마포구', '동교동']

const result = names.join('>');
console.log(result);	// 서울시>마포구>동교동

sort() 메서드

JS 배열 객체에 내장된 메서드로, 배열의 요소를 적절한 위치에 정렬해 줌.

2023.08.08 - [Programming language/JavaScript] - [JavaScript] sort(), ASCII(아스키) 코드 : 배열 객체 정렬, 문자열 정렬, 문자 비교

[JavaScript] sort(), ASCII(아스키) 코드 : 배열 객체 정렬, 문자열 정렬, 문자 비교

math의 수학 연산 메서드

Math.abs(-3);	// 3. 절대값 반환.
Math.ceil(3.3);	// 4. 올림한 정수 반환.
Math.floor(3.3);	// 3. 내림한 정수 반환.
Math.trunc(3.3);	// 3. 소숫점 이하 다 버림.
Math.round(x);	// x(parameter로 입력받은 숫자)를 반올림한 정수 반환.
Math.random();	// 0 이상 1 미만의 부동소숫점 의사 난수 반환.

Math.floor(-4.5);	// -5
Math.trunc(-4.5);	// -4

floor는 소숫점을 내리므로 음수에 Math.floor() 를 사용할 경우 -1인 정수가 반환됨.

따라서 trunc는 소숫점 이하의 수를 다 버리므로 음수의 정수 부분만 반환하고 싶다면 Math.trunc() 를 사용.

문자를 숫자로 변환하는 메서드

parseInt("12.3")	// 정수 형태의 12로 변환
parseInt("45.6")	// 정수 형태의 45로 변환

parseFloat("12.3")	// 실수 형태의 12.3로 변환