JS

JS(4) Type - 원시타입(1) 문자열

UserDonghu 2023. 8. 23. 18:09

원시타입(Primitive Types)

stiring, number, bigint, boolean, undefined, symbol, null등

값이 변경 불가능.

변수에 저장하거나 전달할 때 값에 의한 전달. (가리키고 있는 값을 따라가서 실제 메모리에 저장된 주소가 복사되어 저장)

let a = 100;
let b = a;
a = 50;

console.log(b) // 100

 

원시타입의 메소드

JS는 원시타입도 마치 객체타입처럼 사용할 수 있게 autoboxing이라는 과정을 거침

let val = 'hello!';
console.log(val.toUpperCase());

// 위의 코드가 autoboxing을 거쳐서 내부적으로 아래처럼 실행됨.

let val = 'hello!';
let temp = new String('hello!');
console.log(temp.toUpperCase());
temp = null;

 

 

 

String : 문자열

index가 0부터 시작.

한번 만들어진 문자열은 변하지 않음.

let name = "ABCDE";

console.log(name[2]); // C
console.log(name.length); // 5

name[0] = "a";
console.log(name); // ABCDE 변하지않음

 

템플릿 리터럴로 문자열 생성

` = 백틱

var name = `사과`
var price = 100
var num = 5;

console.log(`${name}의 구매가는 ${price * num}원 입니다.`)

 

문자열 메소드

- indexOf() : 문자 검색해서 인덱스 반환

let text = "안녕하세요 저는 텍스트입니다 텍스트요";
console.log(text.indexOf('텍스트'));
// 9

console.log(text.indexOf('텍스트', 11)); // 11번째 index부터 검색
// 16

console.log(text.indexOf('톡스트')); // 존재하지않으면 -1 
// -1

 

- lastIndexOf() : 뒤에서부터 검색해서 인덱스 반환.

 

- match() : 정규표현식을 인자로 받아서 일치하는 문자열을 찾아 배열의 형태로 반환. g플래그의 유무에 따라 일치하는 값 하나만 찾을지, 모두 찾을지 결정. (정규표현식 공부는 나중에..)

console.log("Naevis 우리 ae, ae들을 불러봐".match(/ae/));
// g 플래그가 없는 경우 : ["ae"]

console.log("Naevis 우리 ae, ae들을 불러봐".match(/ae/g));
// g 플래그가 있는 경우 : ["ae", "ae", "ae"]

console.log("Naevis 우리 ae, ae들을 불러봐".match(/[a-zA-Z]\w+/g));
// w+ => 하나 이상의 문자로 이루어진 단어를 찾습니다 : ["Naevis", "ae", "ae"]

 

- replace() : 문자열 안에서 일치하는 첫번째 문자열을 찾고, 대체해서 바꾼 문자열을 반환. 정규표현식 지원 g플래그로 모든 부분 대체 가능.

console.log("가버렷 가버렷 가버렷 커엍 커엍".replace("커엍", "컷컷컷"));
// "가버렷 가버렷 가버렷 컷컷컷 커엍"

console.log("가버렷 가버렷 가버렷 커엍 커엍".replace(/가버렷/g, "컷컷컷"));
// "컷컷컷 컷컷컷 컷컷컷 커엍 커엍"

 

- slice() : 시작 인덱스와 종료 인덱스만큼 복사해서 새로운 문자열 반환.

console.log("불편해? 불편하면 자세를 고쳐 앉아".slice(7));
// 하면 자세를 고쳐 앉아

console.log("불편해? 불편하면 자세를 고쳐 앉아".slice(7, 13)); // 7(하) 부터 12(를) 까지 슬라이싱
// 하면 자세를

console.log("불편해? 불편하면 자세를 고쳐 앉아".slice(-4));
// 쳐 앉아

console.log("불편해? 불편하면 자세를 고쳐 앉아".slice(-7, 18));
// 를 고쳐 앉

 

- split() : 문자열을 쪼개서 배열 반환.

console.log("La la la la la la".split(" "));
// ["La", "la", "la", "la", "la", "la"]

console.log("La la la la la la".split(""));
// ["L", "a", " ", "l", "a", " ", "l", "a", " ", "l", "a", " ", "l", "a", " ", "l", "a"]

console.log("La-la-la-la-la-la".split("-", 3));
// ["La", "la", "la"]

 

- toLowerCase(), toUpperCase() : 문자열을 소문자, 대문자로 변환한 새로운 문자열 반환

console.log("ABCDEFGHIJKLMN".toLowerCase());
// abcdefghijklmn

 

- trim() : 문자열 앞 뒤 공백 제거

console.log("         a bc  ".trim());
// "a bc"

 

- padStart() : 자릿수에 맞춰 값 채우기

let x = 'XXX'
console.log(x.padStart(5, '0')); // 'XX'를 '0'으로 5자리 채우기
// "00XXX"

'JS' 카테고리의 다른 글

JS(6) Type - 원시타입(3) Boolean, undefined, null  (0) 2023.08.23
JS(5) Type - 원시타입(2) 숫자형  (0) 2023.08.23
JS(3) Type 을 확인하는 방법  (0) 2023.08.23
JS(2) 변수  (0) 2023.08.23
JS(1) JavaScript 기초  (0) 2023.08.23