자바스크립트 코딩테스트
자바스크립 코딩 테스트를 준비하며
자바스크립트에서 자주 사용하는 기본 문법 및 내용들을 정리해 보도록 하겠습니다.
1. 최대 최소값 구하기
2. Math 함수
- 올림 (Math.ceil())
: 숫자를 올림 처리할 때는 주로 Math.ceil() 함수를 사용
-입력받은 숫자보다 크거나 같은 정수 중 가장 작은 정수를 리턴
Math.ceil(1.4); // 2
Math.ceil(1.6); // 2
Math.ceil(-1.4); // -1
Math.ceil(-1.6); // -1
Math.ceil(1); // 1
Math.ceil(); // NaN
- 내림(Math.floor())
: 숫자를 내림 처리할 때는 주로 Math.floor() 함수를 사용
Math.floor(45.9); // 45
Math.floor(45.1); // 45
Math.floor(-45.1); // -46
Math.floor(-45.9); // -46
Math.floor(1); // 1
Math.floor(); // NaN
- 반올림(Math.round())
: 숫자를 반올림 처리할 때는 주로 Math.round() 함수를 사용
Math.round(1.2); // 1
Math.round(3.5); // 4
Math.round(-3.5); // -4
Math.round(-3.1); // -4
- 최댓값, 최솟값 (.max() & .min())
.max()는 입력값으로 받은 0개 이상의 숫자 중 가장 큰 숫자, 최댓값을 반환
.min()은 입력값으로 받은 0개 이상의 숫자 중 가장 큰 숫자, 최댓값을 반환
Math.max([value1[, value2[, ...]]])
Math.min([value1[, value2[, ...]]])
- 절댓값 (.abs())
:.abs()는 주어진 숫자의 절대값을 반환
Math.abs(4); // 4
Math.abs(3.141592653589793); // 3.141592653589793
Math.abs(-3.141592653589793); // 3.141592653589793 양수로 반환
Math.abs("-1"); // 1
Math.abs(""); // 0
- 제곱근(.sqrt())
: .sqrt()는 숫자의 제곱근을 반환
Math.sqrt(9); // 3
Math.sqrt(2); // 1.414213562373095
Math.sqrt(1); // 1
Math.sqrt(0); // 0
Math.sqrt(-1); // NaN
3. 최대/최소 Number 값 세팅
- 안전한 최대 ,최소 정수 값을 나타냄
const max = Number.MAX_SAFE_INTEGER;
const min = Number.MIN_SAFE_INTEGER;
- min 값을 최대 정수로 표현하여 최솟값을 찾을 수 있음
<script>
function solution(arr){
let answer;
min = Number.MAX_SAFE_INTEGER;
//min =arr[0]
for(let i =0 ; i < arr.length; i++) {
if(arr[i]<min) min = arr[i];
answer = min;
return answer;
}
}
let arr=[5, 7, 1, 3, 2, 9, 11];
console.log(solution(arr));
</script>
- Math 메소드를 통하여 더 손쉽게 배열의 최솟값을 확인 가능
- call() , apply()
- 함수 호출 방식과 상관없이 this를 지정할 수 있습니다.
- 대부분의 경우 this의 값은 함수를 호출한 방법에 의해 결정됩니다.
실행 중에는 할당으로 설정할 수 없고 함수를 호출할 때마다 다를 수 있습니다.
함수를 어떻게 호출했는지 상관하지 않고 this값을 설정할 수 있는 메서드입니다.
call(this로 사용될 값, 호출할 함수의 매개변수들 ... )apply(this로 사용될 값, 호출할 함수의 매개변수들을 배열로 받는다. )
- Math.min 메소드는 배열을 인자를 받을 수 없음
// ...arr 이나 .apply(null,arr)을 통하여 배열을 가져옴
<script>
function solution(arr){
// let answer = Math.min(...arr);
let answer = Math.min.apply(null,arr);
return answer;
}
let arr=[5, 7, 1, 3, 2, 9, 11];
console.log(solution(arr));
</script>
4. 배열 갖고 오기
- for문
for (let i = 0; i < array.length; i++) {
console.log(array[i]);
}
- for.. of 반복문
배열에 많이 사용, 배열의 요소 개수만큼 반복하고, 반복 때마다 각 요소들을 사용할 수 있는 변수가 주어지는 반복문
forEach 처럼 index를 가져오지는 못함
for (변수 of 배열) {
반복동작부분
}
5. 배열 추가, 삭제 함수
- 자바스크립트는 배열의 길이를 동적으로 변경
배열 추가 : Array.push(), Array.unshift(), Array.splice()
배열 삭제 : Array.pop(), Array.shift(), Array.splice()
- push
push 메서드는 배열의 끝에 하나 이상의 요소를 추가하고, 배열의 새로운 길이를 반환한다.
원본 배열을 바꾼다.
var arr = ['a', 'b', 'c'];
arr.push('d');
// arr = ['a', 'b', 'c', 'd']- pop
배열에서 마지막 요소를 제거하고 제거된 요소를 반환
let arr = ["1","2","3","4"];
let returnValue = arr.pop();
console.log(arr);
["1","2","3"]
console.log(returnValue)
4
- unshift
: 배열의 앞쪽에 요소를 추가
var arr = ['a', 'b', 'c'];
arr.unshift('d'); // 배열의 앞쪽에 요소를 추가
// arr = ['d', 'a', 'b', 'c']
- shift
: 배열의 첫번째 요소를 제거
var arr = ['a', 'b', 'c', 'd', 'e'];
arr.shift();
// arr = ['b', 'c', 'd', 'e']- splice
: 배열에서 요소를 추가, 제거 또는 교체하는 작업을 수행한다. 이때 원본 배열이 수정된다.
array.splice(start, deleteCount, item1, item2, ...)
- deleteCount가 생략되거나
deleteCount가 array.length(원본 배열 길이) - start 의 값보다 큰 경우, 지정한 start 인덱스부터 끝까지 모두 제거
let array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
let newArr1 = array.splice(3); // 원본 : [1, 2, 3]
console.log(newArr1); // 삭제 요소 : [4, 5, 6, 7, 8, 9, 10, 11, 12]
/* [4, 5, 6, 7, 8, 9, 10, 11, 12]를 가지는 배열에서 다시 splice 진행 */
let newArr2 = newArr1.splice(6, 4); // 원본2 : [4, 5, 6, 7, 8, 9]
console.log(newArr2); // 삭제 요소 :[10, 11, 12]
- 음수로 시작하면 뒤에서 6번째부터 수정
let array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
let newArr1 = array.splice(-6, 4); // 원본 : [1, 2, 3, 4, 5, 6, 11, 12]
console.log(newArr1); // 삭제 요소 : [7, 8, 9, 10]
- 제거된 요소를 포함할 수 있고, 새로 삽입된 요소들 또한 포함
const fruits = ['apple', 'banana', 'cherry', 'date', 'elderberry'];
// 인덱스 2번 부터 2개의 요소(cherry, date)를 제거하고, 'grape', 'kiwi'를 삽입
const removedElements = fruits.splice(2, 2, 'grape', 'kiwi');
console.log(fruits); // 원본 배열 : ['apple', 'banana', 'grape', 'kiwi', 'elderberry']
console.log(removedElements); // 삭제된 요소 배열 : ['cherry', 'date']
- deleteCount가 0이라면 삭제 없이 뒤에 요소를 추가할 수도 있다!!!!
- slice / slice(start, end)
- 시작 인덱스를 포함한 뒤 추출 / end 번호 바로 앞의 인덱스까지 수행
: 특정 범위를 복사한 값들을 담고 있는 새로운 배열을 만드는데 사용
=> splice() 함수와 달리 아무리 많이 호출해도 원본 배열의 값은 절대 건드리지 않는다
const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let newArr1 = array.slice(3, 5); // [4, 5]
let newArr2 = array.slice(undefined, 5); // [1, 2, 3, 4, 5]
let newArr3 = array.slice(-3); // [8, 9, 10]
let newArr4 = array.slice(-3, 9); // [8, 9]
let newArr6 = array.slice(4); // [5, 6, 7, 8, 9, 10]
6. forEach . reduce , map , filter , sort
7. replace
: 문자열에서 변경하려는 문자열이 여러 번 반복될 경우, 첫 번째로 발견한 문자열만 치환
정규식으로 찾으려는 문자열은 '/'로 감싸서, 파라미터로 들어가는 값이 정규식 임을 알려줍니다.
그리고, '/' 뒤에는 'g'라는 modifier를 붙이면 모든 문자열 치환
str.replace(/A/g,"d")
대소문자 구분없이 문자열을 치환 할때는 'i' modifier를 사용
str.replace(/A/gi,"d")
8. split()
- 문자열을 배열로 만듦
let newArray = string.split(separator, limit);
-separator: 문자열을 분할할 때 사용할 구분자입니다.
이 구분자를 기준으로 문자열이 분할됩니다.
구분자를 지정하지 않으면 문자열 전체가 하나의 요소로 포함된 배열을 반환합니다.
-limit (선택 사항): 분할할 최대 요소 수입니다.
이 옵션을 사용하면 배열에 포함될 요소의 수를 제한할 수 있습니다.
* 피라미터에 아무것도 전달하지 않으명 문자열 전체를 length 1인 배열에 담아서 리턴
const 하드웨어 = "cpu memory bus resister";
const arr = 하드웨어.split();
console.log(arr); //["cpu memory bus resister"]
console.log(arr.length); //1
* " " 을 통하여 단어별로 잘라서 배열에 담는다
const 하드웨어 = "cpu memory bus resister";
const arr = 하드웨어.split(" ");
console.log(arr); //["cpu","memory","bus","resister"]
console.log(arr.length); //4
console.log(arr[0]); //"cpu"
console.log(arr[1]); //"memory"
console.log(arr[2]); //"bus"
console.log(arr[3]); //"resister"
* 글자별로(separator="")잘라서 배열에 담기
const 하드웨어 = "cpu memory bus resister";
const arr = 하드웨어.split("");
console.log(arr); //["c","p","u"," ","m","e","m","o","r","y"," ","b","u","s"," ","r","e","s","i","s","t","e","r"]
console.log(arr.length); //23
* 특정 구분자로 잘라서 배열에 담기
const 하드웨어 = "cpu,memory,bus,resister";
const arr = 하드웨어.split(",");
console.log(arr); // ["cpu","memory","bus","resister"]
console.log(arr.length); //4
* limit 값 지정하기 / limit 값에 맞는 배열 생성
const 하드웨어 = "cpu,memory,bus,resister";
const arr = 하드웨어.split(",", 2);
console.log(arr); // ["cpu","memory"]
console.log(arr.length); //2
console.log(arr[0]); //"cpu"
console.log(arr[1]); //"memory"
console.log(arr[2]); //undefined
9. 아스키코드
10. charCodeAt()
- 문자를 아스키코드를 변환
* 대문자 개수 찾기 예시 / 문자 => 아스키 / 대문자 몇개 있는지 확인
<html>
<head>
<meta charset="UTF-8">
<title>출력결과</title>
</head>
<body>
<script>
function solution(s){
let count = 0;
for(let x of s){
let num = x.charCodeAt();
if(num>=65 && num<=90){
count++;}
}
return count;
}
let str="KoreaTimeGood";
console.log(solution(str));
</script>
</body>
</html>
12. 대문자 소문자 치환
- toUpperCase()
- 문자를 대문자로 치환
- 실제 값은 변하지 않음
<html>
<head>
<meta charset="UTF-8">
<title>출력결과</title>
</head>
<body>
<script>
function solution(s){
let count = 0;
for(let x of s){
if(x===x.toUpperCase())count++;
}
return count;
}
let str="KoreaTimeGood";
console.log(solution(str));
</script>
</body>
</html>
- toLowerCase()
* 만약 입력 받은 문자가 소문자라면 대문자로 치환하는 코드
<html>
<head>
<meta charset="UTF-8">
<title>출력결과</title>
</head>
<body>
<script>
function solution(s){
let answer ="";
for( x of s){
if(x === x.toLowerCase()){
answer += x.toUpperCase();
}else answer += x;
}
return answer;
}
let str="ItisTimeToStudy";
console.log(solution(str));
</script>
</body>
</html>
13. 문자열 가르기
- substr() //!!!!!!!!!!이제 안쓰는 문법!!!!!!!!!!!
문자열의 일부를 일정 길이만큼 추출하고 싶을 때 사용
음수 인덱스를 넘길 수도 있는데요. -1이 끝에서 첫 번째 문자
"문자열".substr(startIndex, length);
"ABCDEFG".substr(2, 3); // "CDE"
"ABCDEFG".substr(-5, 3); // "CDE"- substring()
시작과 종료 인덱스를 기준으로 자르고 싶을 때 사용
=> 두 번째 인자로 문자열 길이 대신에 종료 인덱스를 받는다
음수 인덱스를 넘기면 0을 넘긴 것처럼 작동
"문자열".substring(startIndex, endIndex);
"ABCDEFG".substring(2, 5); // "CDE"
"ABCDEFG".substring(-5, 3); // "ABC"
*slice와의 차이가 무엇일까??
배열을 잘라주는 slice / 문자열을 가르는 substring (slice로 문자열 가르기도 가능...)
✔ 문자열을 자르는 메서드
문자열.substring(시작인덱스, 종료인덱스)
문자열.substr(시작인덱스, 자를 문자의 길이)
ECMA-262 표준에 따라, substr() 사용을 자제할 것배열을 자르는 메서드
✔ 배열을 자르는 메서드
배열.slice([시작인덱스[, 종료인덱스]]) (원본 배열 안바뀜)
배열.splice([시작인덱스[, 제거할 요소의 수[, 추가할 요소]]]) (원본 배열 바뀜)
14. 특정 문자의 위치 찾기
- indexOf()
:문자열(string)에서 특정 문자열(searchvalue)을 찾고,
검색된 문자열이 '첫번째'로 나타나는 위치 index를 리턴 존재하지 않는 경우에는 -1을 반환
let index = string.indexOf(searchValue, startIndex);
- indexOf("o")
문자열에서 'o' 문자의 첫 번째로 등장하는 인덱스 반환
- indexOf("o", 5)
문자열에서 인덱스 5부터 검색을 시작하여 'o' 문자의 첫 번째로 등장하는 인덱스 반환
function solution(a) {
let answer = ""; // 결과를 저장할 변수 초기화
// 문자열 a의 각 문자를 순차적으로 확인
for (let i = 0; i < a.length; i++) {
// 현재 문자가 첫 번째로 등장하는 경우에만 answer에 추가
if (a.indexOf(a[i]) === i) {
answer += a[i]; // 첫 등장한 문자만 answer에 추가
}
}
return answer; // 중복 문자가 제거된 결과 반환
}
console.log(solution("keekkset")); // 예시 실행, 결과: "kset"
a.indexOf(a[i]) === i; 를 통하여 한번만 등장하는 문자를 확인이 가능하다!!!!