JavaScript(6)
-
[JS] Array.sort
| Array.sort 자바스크립트의 sort() 메서드는 배열의 요소를 적절한 위치에 정렬 한 이후 배열을 반환한다. 주의해야 할 점은 복사본이 만들어지는 것 이 아닌 원 배열이 정렬 된다. 로직에 따라 원본을 유지할 것인지 아니면 정렬 된 값을 반환만 하는 함수인지 꼭 구분 지어서 로직을 작성해야 한다. | Number 정렬 숫자를 정렬하면 내가 원하는 결과값이 안나온다. 그 이유는 sort 메소드의 기본 정렬 순서는 다음과 같다. - 문자열 유니코드(Unicode) 코드 포인트(code point) 에 따른다. - 배열의 모든 항목이 문자열로 변환된 이후 문자열의 유니코드 값이 선택된 다음에 정렬을 진행한다. 그래서 comparator function(선택적 함수)을 인자로 전달 해야 한다. | C..
2023.10.12 -
동적 타입 언어와 정적 타입 언어
동적 타입 언어와 정적 타입 언어 (22.02.16 작성) C 나 JAVA 는 정적 타입 언어 이다. 변수를 선언할 때 변수에 할당할 수 있는 값의 종류, 즉 데이터 타입을 사전에 선언해야 한다. 이를 명시적 타입 선언 이라 한다. 정적 타입 언어는 변수의 타입을 변경할 수 없다. 변수에 선언한 타입에 맞는 값만 할당할 수 있다. 정적 타입 언어는 컴파일 시점에 타입 체크 (선언한 데이터 타입에 맞는 값을 할당했는지 검사하는 처리) 를 수행 한다. 타입 체크를 통과하지 못했다면 에러를 발생 시키고 프로그램의 실행 자체를 막는다. 타입의 일관성을 강제함으로써 더욱 안정적인 코드의 구현을 통해 런타임에 발생하는 에러를 줄인다. 즉 매우 번거롭지만 안정적인 코드의 구현이 가능하다는 소리이다. 대표적인 정적 타..
2023.06.05 -
비구조화 할당
비구조화 할당 비구조화 할당은 ES6에서 추가된 문법이다. 배열이나 객체 속성을 해체하여 개별 변수에 값을 담을 수 있다. 비구조화 할당의 장점 배열, 객체 내 값을 추출하는 코드가 매우 간단해진다. 필요한 객체와 나머지 요소 분리가 매우 간단하다. 기본값 지정이 가능하다. 비구조화 할당 문법 비구조화 할당이라는 문법이 나오기 전에는 배열안에 있는 요소를 꺼내기 위해서는 직접 하나하나 꺼내서 값을 지정해줘야 했다. let arr = [1,2,3]; let one = arr[0]; let two = arr[1]; let three = arr[2]; console.log(one,two,three); // result : 1 2 3 굉장히 번거로운 작업을 거쳐야 배열의 요소를 변수에 담을 수 있었다. 하지만 ..
2023.04.24 -
async & await (비동기 처리를 동기처럼 작동하게 하려면?)
async & await ES8 에서는 제너레이터보다 간단하고 가독성 좋게 비동기 처리를 동기처럼 동작하도록 구현할 수 있는 async 와 await이 도입 되었다. Promise 의 후속 처리 메서드 없이 마치 동기 처럼 Promise가 처리 결과를 반홚하도록 구현 할 수 있다. async 함수 function 앞에 async를 적어주면 함수는 Promise 객체를 생성했을 때 처럼 Promise 를 반환한다. Promise 가 아닌 값을 반환 하더라도 이행 상태의 Promise로 감싸주면 그 값을 감싸서 이행 된 Promise로 반환한다. async function f() { return 1; } f().then(alert); // 1 Promise를 반환 받아도 가능하지만 결과는 똑같다. 결론으로 ..
2023.04.24 -
Spread 문법
Spread 문법 Spread 문법은 javaScript 에서 자주 사용하는 유용한 문법이다. React에서 매우 유용하게 사용했던 친구 중 하나이다. 나머지 매개변수 기능을 반대로 제공해주는 친구라고 생각하면 편할 것이다. 나는 미리 사용을 해봤는데 주로 배열이나 객체를 펼칠 때 사용했다. 객체를 펼친다 라는 건 무슨 말인지 처음에는 의아했다. 코드를 한번 보면 확실하게 이해가 갈 것이다. // Spread 연산자 사용 let arr2 = [1, 2, 3, 4, 5]; console.log(...arr2); // result = 1 2 3 4 5 말 그대로 펼쳐준다. Spread 문법은 이터러블 객체에만 사용할 수 있다. 또한 아주 유용한 예제가 있다. // Spread 1 const cookie = ..
2023.04.24 -
프로미스 객체 (Promise Object)
Promise 객체 비동기 처리를 조금 더 편하게 처리 할 수 있는 ES6에서 도입된 기능이다. Promise 는 자바스크립트 비동기 처리에 사용되는 객체이다. Promise 가 필요한 이유? 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용된다. 예를 들어 요청한 데이터를 다 받아오기도 전에 화면에 출력하려면 에러가 발생하거나 빈 화면을 출력한다. 이러한 문제점을 해결하기 위한 것이 Promise 이다. 이전에는 비동기 처리를 하기 위해 콜백함수로 처리를 해야했다. 하지만 콜백함수로 처리하게되는 코드가 많으면 콜백지옥이 발생하게 된다. 콜백 지옥이란 콜백함수안의 또 콜백함수 그리고 또 콜백함수 이렇게 계속 파고 드는 것을 말한다. 콜백 지옥(콜백헬) 은 가독성을 나쁘게 하며 실수를 유발하는 원인이 ..
2023.04.24