본문 바로가기

JavaScript

 (83)
[JavaScript] sort/ reverse 메소드 [sort 메소드] 배열에서는 sort 라는 메소드를 활용해 배열을 정렬할 수 있다. sort 메소드에 아무런 아규먼트도 전달하지 않을때는 기본적으로 유니코드에 따라 정렬된다. const letters = ['D', 'C', 'E', 'B', 'A']; const numbers = [1, 10, 4, 21, 36000]; letters.sort(); numbers.sort(); console.log(letters); // (5) ["A", "B", "C", "D", "E"] console.log(numbers); // (5) [1, 10, 21, 36000, 4] 그렇기 때문에 위처럼 상식적으로 우리가 생각하는 정렬과 다를 수 있는데, 그럴때는 sort 메소드에 다음과 같은 콜백함수를 아규먼트로 작성해주..
[JavaScript] 복합 할당연산자/ 증가, 감소연산자 [복합 할당연산자] 할당 연산자와 결합해서 자주 쓰이는 표현을 더 간략하게 쓸 수 있게 해주는 연산자를 복합 할당 연산자(Compound assignment operators)라고 한다. // 다음 두 줄은 같습니다 x = x + 1; x += 1; // 다음 두 줄은 같습니다 x = x + 2; x += 2; // 다음 두 줄은 같습니다 x = x * 2; x *= 2; // 다음 두 줄은 같습니다 x = x - 3; x -= 3; // 다음 두 줄은 같습니다 x = x / 2; x /= 2; // 다음 두 줄은 같습니다 x = x % 7; x %= 7; [증가, 감소 연산자] 변수의 값을 1씩 증가시키거나 감소시킬 때는 복합 할당 연산자보다 더 간략하게 쓸 수 있는 증가연산자, 감소연산자를 사용할 수..
[JavaScript] 자료형 1. 숫자 (Number) 정수 (integer) : -3, 5, 10, 0 소수 (floating point) : 3.14, 5.9, 0.031 기본적으로 사칙연산이 가능하다. 2. 문자열 (String) 큰따옴표, 작은따옴표를 앞뒤로 감싼 형태로 앞뒤 따옴표를 통일해 주어야 함. "drink" , 'coke' 더하기 기호를 쓸 수 있는데, "drink" + "coke" = "drinkcoke" 처럼 사용가능 하다. 3. 불린(Boolean) 참 혹은 거짓을 나타내는 것 참 (True) : 8 > 6 거짓 (False) : 6 > 8
[JavaScript] 구구단 게임 Math.random(); 0~0.1 사이의 무작위 수를 랜덤으로 추출 Math.ceil(); 내림 var a = Math.ceil(Math.random() * 9); var b = Math.ceil(Math.random() * 9); while (true) { var answer = prompt(`${a} x ${b} = ?`); // 퀴즈 - 정답 창 if (answer == (a * b)) { alert('정답입니다!'); var a = Math.ceil(Math.random() * 9); // 문제 새로 변경 var b = Math.ceil(Math.random() * 9); // 문제 새로 변경 } else { alert('오답입니다!'); } }
[JavaScript] async 함수가 리턴하는 promise 객체 다음의 코드를 실행하면, async function fetchAndPrint() { return 3; } fetchAndPrint(); async 가 붙은 함수는 항상 promise 객체를 return 한다. 따라서, fechAndPrint 함수는 promise 객체를 return 하며, 이는 fulfilled 상태이고 그 작업성공결과는 3이다. 다음 함수를 실행하면, async function fetchAndPrint() { return fetch('https://jsonplaceholder.typicode.com/users') .then((response) => response.text()); } fetchAndPrint(); 리턴된 promise 객체와 동일한 상태, 작업성공결과를 가진 promis..
[JavaScript] async/ await 의 catch/ finally 문 다음과 같이 잘못된 url 주소를 입력한 코드를 실행하면, async function fetchAndPrint() { const response = await fetch('https://jsonplaceholder.typicode.commm/users'); const result = await response.text(); console.log(result); } fetchAndPrint(); 다음과 같이 에러가 발생. [try catch 문] 이 문제를 해결하기 위해 try catch 문을 사용하면, async function fetchAndPrint() { try { const response = await fetch('https://jsonplaceholder.typicode.commm/users'..
[JavaScript] async/ await 다음 코드를 실행하면, // fetch('https://jsonplaceholder.typicode.com/users') // .then((response) => response.text()) // .then((result) => { console.log(result); }); async function fetchAndPrint() { const response = await fetch('https://jsonplaceholder.typicode.com/users'); const result = await response.text() console.log(result); } fetchAndPrint(); 위의 주석처리한 promise chain 코드를 실행했을 때와 똑같이 response 가 잘 출력됨...
[JavaScript] axios fetch 함수는 Ajax 통신을 하는 함수이다. 그런데 오늘날 개발 실무에서는 이 fetch 함수 말고도 Ajax 통신을 할 수 있는 방법이 존재하는데, 그것은 바로 axios 라고 하는 외부 패키지를 사용하는 것이다. axios 패키지를 사용한 코드를 보면, axios .get('https://jsonplaceholder.typicode.com/users') .then((response) => { console.log(response); }) .catch((error) => { console.log(error); }); 이 코드는 axios 패키지에서 제공하는 axios 객체를 사용해서 GET 리퀘스트를 보내고 그 리스폰스를 받는 코드이다. 자세히 보면 지금 코드에서 axios.get이라고 쓰여 있는..

티스토리툴바