2024.01.12 TIL

버블소트 구현하기

function bubbleSort(arr) {
    var len = arr.length; // 배열의 길이 저장

    for (var i = 0; i < len - 1; i++) { // 배열을 처음부터 끝까지 순회
        for (var j = 0; j < len - i - 1; j++) { // 현재 순회 중인 부분에서 비교하며 순회
            if (arr[j] > arr[j + 1]) { // 현재 원소가 다음 원소보다 큰 경우
                // 두 값을 교환
                var temp = arr[j];
                arr[j] = arr[j + 1];
                arr[j + 1] = temp;
            }
        }
    }

    return arr; // 정렬된 배열 반환
}

// 테스트
var arrayToSort = [64, 34, 25, 12, 22, 11, 90];
bubbleSort(arrayToSort);
console.log(arrayToSort); // 정렬된 배열 출력

 

정규표현식(Regular Express)

사용자가 리뷰를 작성할 때 엔터를 쳐서 줄바꿈을 하면 추가된 리뷰 댓글에서도 줄바꿈하여 출력하는 기능을 구현할 때 정규표현식 이라는 것을 알게되어 사용해봤다.

정규표현식이란 특정한 규칙을 가진 문자열의 집합을 표현하는 데 사용하는 형식 언어이다. 정규 표현식은 많은 텍스트 편집기와 프로그래밍 언어에서 문자열의 검색과 치환을 위해 지원하고 있다.

/regexr/i

regexr에는 문자열값이 들어가고, i 자리에는 패턴을 지정해준다.예를 들어 /a/i 는 '대소문자 구분없이 a를 찾아라' 라는 뜻이 된다.

나의 경우에서는 ' /n '이라는 문자를 '<br>'로 바꾸어야 했기 때문에 정규표현식으로 표현하면 /\n/g가 된다.

 

참고하기 좋은 사이트🔽

📚 JavaScript 정규 표현식 문법 총정리 + 응용 예제

 

 

position 중앙 정렬 하기

 

postion 자식을 중앙 정렬 하기위해 top; 50%, left: 50%를 주면 위 사진과 같이 중앙에 정렬되지 않고 밀려난다.

그렇기 때문에 요소에 변형(이동, 회전, 크기 조절, 기울임 등)을 적용할 때 사용하는 transform의 속성 중 translate을 통해 요소를 요소의 50%만큼 좌상단으로 이동시켜야한다.

.trailer-container {
  position: relative;
  background-color: #0060bf;
  padding-bottom: 56.25%;
}

.trailer-container iframe {
  position: absolute;
  top: 50%; /* 위에서 50%만큼 이동 */
  left: 50%; /* 왼쪽에서 50%만큼 이동*/
  width: 100%;
  height: 100%;
  border-radius: 10px;
  transform: translate(-50%, -50%); /* 자신의 50%만큼 위, 왼쪽 이동 */
}

 

 

Promise

Promise.all = 하나만 에러나도 catch 로 이동

Prmise.allsettled = 프로미스를 병렬로 실행하고, 실패 성공 여부에 상관없이 모두 끝날 때 까지 기다린 다음 성공한 것들은 fulfilled, 실패한 것은 rejected

 

화살표함수는 this 바인딩을 하지 않는다. (상위 스코프)