i can do ik!

Ajax

• Ajax는 Asynchronous Javascript and Xml의 약자.
• 자바스크립트의 라이브러리 중 하나이며, 브라우저가 가지고 있는 XMLHttpRequest 객체를 이용해 전체 페이지를 새로 고치지 않고 페이지의 일부만을 로드하는 기법.
• 자바스크립트를 사용한 비동기 통신이며, 클라이언트와 서버간에 XML 데이터를 주고받는 기술.

Ajax 장단점

장점

• 페이지 이동 없이 고속으로 화면을 전환할 수 있다.
• 서버 처리를 기다리지 않고, 비동기 요청이 가능하다.
• 수신하는 데이터 양을 줄일 수 있고, 클라이언트에게 처리를 위임할 수도 있다.
• 플러그인 없이도 인터렉티브 한 웹페이지 구현할 수 있다.

단점

• Ajax를 쓸 수 없는 브라우저에 대한 문제가 있다.
• HTTP 클라이언트의 기능이 한정되어 있다.
• 페이지 이동없는 통신으로 인한 보안상의 문제
• 지원하는 Charset이 한정되어 있다.
• 스크립트로 작성되므로 디버깅이 용이하지 않다.
• 요청을 남발하면 역으로 서버 부하가 늘 수 있다.

동기식, 비동기식 비교

location.href, location.replace() 비교

• 기본적인 페이지는 location.href를 사용.
• 뒤로가면 안되는 페이지(로그인 후)들은 location.replace()사용

String.length

문자열의 길이를 반환한다.

let text = 'abcd';

console.log(text.length); // 4

Array.length

배열의 길이를 반환한다. 

let arr = ['aa', 'bb', 'cc', 'dd'];

console.log(arr.length); // 4

Math.abs()

Math.abs()는 주어진 숫자의 절대값을 반환한다.

빈 객체, 하나 이상의 요소를 가진 배열, 숫자가 아닌 문자열, undefined나 빈 매개변수를 받으면 NaN을 반환.

null, 빈 문자열이나 빈 배열을 제공하면 0을 반환.

Math.abs(x);

Math.abs() 예제

Math.abs('-1');     // 1
Math.abs(-2);       // 2
Math.abs(null);     // 0
Math.abs('');       // 0
Math.abs([]);       // 0
Math.abs([2]);      // 2
Math.abs([1,2]);    // NaN
Math.abs({});       // NaN
Math.abs('string'); // NaN
Math.abs();         // NaN

toUpperCase()

toUpperCase()는 문자열을 대문자로 반환한 값을 반환.

toUpperCase() 예제

let text = 'abcd';

console.og(text.toUpperCase()); // 'ABCD'

toLowerCase()

toLowerCase()는 문자열을 소문자로 반환한 값을 반환.

toLowerCase() 예제

let text = 'ABCD';

console.log(text.toLowerCase()); // 'abcd'

trim()

문자열의 양끝의 공백을 제거한 문자열을 반환.

문자열에 공백이 없어도 예외가 발생하지 않고 새 문자열이 반환.

한쪽 끝의 공백만 제거한 문자열을 반환하려면 trimStart() 또는 trimEnd()를 사용.

trim() 예제

let text = '   text   ';

console.log(text.trim()); // 'text'

console.log(text.trimStart()); // 'text   '

console.log(text.trimEnd()); // '   text'

Math.pow()

Math.pow()는 제곱을 구할 때 사용.

Math.pow(base, exponent)

parameter

base - 밑 값.

exponent - 밑을 제곱하기 위해 사용하는 지수.

return

밑 값을 지수 값으로 거듭제곱한 값.

Math.pow() 예제

// 밑이 양수 지수가 양수
Math.pow(7, 2);    // 49
Math.pow(2, 10);   // 1024
// 밑이 양수 지수가 소수 또는 분수
Math.pow(2, 0.5);  // 1.4142135623730951 (2의 제곱근)
Math.pow(2, 1/3);  // 1.2599210498948732 (2의 세제곱근)
// 밑이 양수 지수가 음수
Math.pow(7, -2);   // 0.02040816326530612 (1/49)
Math.pow(8, -1/3); // 0.5
// 밑이 음수 지수가 양수
Math.pow(-7, 2);   // 49 (제곱의 결과값은 양수.)
Math.pow(-7, 3);   // -343 (세제곱은 음수가 될 수 있다.)
// 밑이 음수 지수가 소수 또는 분수
Math.pow(-7, 0.5); // NaN (음수는 실제 제곱근을 가지지 않는다.)
Math.pow(-7, 1/3); // NaN

pop()

pop()은 배열의 마지막 요소를 제거.

제거한 요소를 리턴.

arr.pop()

return

배열에서 제거한 요소를 리턴.

pop()예제

const arr = ['apple', 'peach', 'grape']; 
const popArr = arr.pop(); 

console.log(popArr); // 'grape';
console.log(arr); // ['apple', 'peach'];