목록Javascript (10)
나만의 코딩 일지
변수(Variable) 변수는 데이터를 저장할 때 쓰이는 저장소 같은 역할을 하며 그 저장소에 이름을 표현하는 것을 변수라고 한다. let str = "변수 테스트"; let a = 5; 위에 코드를 보게 되면 let 키워드를 사용해 변수를 생성하고 str와 a는 변수에 이름이 된다. 그리고 오른쪽에 있는 데이터가 각각 str와 a 안에 들어가게 되는 원리이다. 변수의 특징 변수는 let 또는 var 키워드를 상용해 변수를 생성한다. 변수의 키워드는 let과 var 두 가지가 있다. 이 두 개의 변수 키워드의 기능은 똑같다. 하지만 var은 오래전에 사용했던 키워드고 최근에는 let 키워드를 많이 사용한다. 변수의 값을 저장할 때는 = 할당 연산자를 사용해 오른쪽에 있는 데이터를 외쪽에 있는 변수에 값을..
배열 메서드 사용법 push('원소') : 배열의 마지막 인덱스의 요소 추가 const fruits = ['apple', 'banana', 'grape', 'plum', 'orange']; fruits.push('strawberry'); console.log(fruits); // 출력결과 : ['apple', 'banana', 'grape', 'plum', 'orange']; pop() : 배열 마지막 인덱스의 요소를 삭제 const fruits = ['apple', 'banana', 'grape', 'plum', 'orange']; console.log(fruits.pop()); // 출력결과 : orange unshift('원소') : 배열의 맨 앞에 위치에 원소를 추가, 새로운 배열의 길이를 리턴 ..
숫자 0, 빈 문자열 "", null, undefined, NaN은 불린형으로 변환시 모두 false가 된다. 연산자 &&는 ||보다 우선순위가 높다. 자바스크립트에서 || 연산자 특징 가장 왼쪽 피연산자부터 시작해 오른쪽으로 나아가며 피연산자를 평가한다. 각 피연산자를 불린형으로 변환하고 변환 후 그 값이 true이면 연산을 멈추고 해당 피연산자의 변환 전 원래 값을 변환한다. 피연산자 모두를 평가한 후(모든 피연산자가 false로 평가되는 경우)엔 마지막 피연산자를 반환된다. 반환 값은 형 변환을 하지 않은 원래 값이다. null 병합 연산자 ??를 사용하면 피연산자 중 값이 할당된 변수를 빠르게 찾을 수 있다. a ?? b : a가 null도 아니고 undefined도 아니면 a를 반환 그 외의 경..
자바스크립트 객체 // 객체 생성 1. let foo = new Object; 2. let foo = {}; 3. let foo = { name : 'foo', major : "computer science" }; // 객체 프로퍼티 읽기 alert(foo.name); // foo alert(foo.major); // computer science // 객체 프로퍼티 갱신 foo.major = 'electronics engineering'; // 객체 프로퍼티 동적 생성 foo.age = 30; // 객체 프로퍼티 생성 // 대괄호 표기법을 사용할 경우 foo.['age'] = 30; // 대괄호 안에 반드시 작은따옴표나 큰따옴표가 있어야 한다. alert(foo['age']); // 30 대괄호 표현법..
synchronous 와 asynchronous 차이 console.log(1); console.log(2); console.log(3); /* 실행결과 : 1 2 3 */ 자바스크립트에서 console.log를 실행하면 위에서 부터 아래로 순차적으로 실행 실행되는걸 알 수 있다. 즉 이런걸 동기적으로 실행된다라고 한다. 다시 말해 synchronous 라고 부른다. console.log(1); setTimeout(function () { console.log(2) }, 3000); console.log(3); /* 실행결과 : 1 3 2 */ 코드를 살펴보면 setTimeout 함수로 인해 3초후 console.log(2)가 실행 되는걸 알 수 있다. 즉 3이 먼저 실행된후 2가 실행된다. 이렇게 순차..
async, await async, await는 promise 객체를 좀 더 편하게 사용할 수 있도록 나온 문법이다. async function f(){ await .... } async 문법 async function f(){ return 'async'; } console.log(f()); // 출력결과 -> Promise {: 'async'} async 문법을 사용해서 console에 출력해 보면 Promise 객체로 출력되는 걸 알 수 있다. f().then(console.log); // 출력결과 -> async 즉 Proise 객체와 같이 asyns를 사용하면 then() 함수를 사용할 수 있고 async를 사용한 함수의 return 값이 resolve 값이 된다. await 문법 function..
alert alert 함수는 메시지가 있는 작은 모달 창이라고 부른다. 즉 arlert 함수를 실행하면 확인 취소 버튼이 있는 창이 뜨게 된다. alert("값을 입력하세요"); prompt 브라우저에서 제공한는 prompt는 두 개의 인수를 받는다. result = prompt(title, [default]); prompt는 인자를 두 개 받는다 앞에 title은 사용자에게 보여줄 문자열이고 뒤에 있는 [default]는 입력창 안에 보여줄 문자열이다. [] : default에 감싸는 대괄호는 선택사항이라는 뜻을 지닌다. result = prompt('숫자를 입력하세요', "1 ~ 100까지 입력"); alert(`당신이 입력한 숫자는 ${result}입니다.`); confirm confirm 함수는 ..
Promise Promise는 자바스크립트에서 비동기(asynchronous)식 방법을 사용할 때 사용하는 객체이다. Promise 객체는 비동기 작업이 맞이할 미래의 성공 또는 실패와 그 결과값을 나타낸다. (즉 순차적으로 실행했을 때가 아닌 각자 자신에 주어진 동작을 실행했을 때의 결과가 성공 혹은 실패했을 때의 결과값을 나타낸다.) Promise의 3가지 상태 pending( 대기) : 이행하지도, 거부하지도 않은 초기 상태 (대기 상태) fulfiled( 이행) : 연산이 성공적으로 완료된 상태 reject(거부) : 연산이 실패한 상태 new Promise((resolve, reject)=>{ ..... }); Promise 객체를 사용하기 위해서는 new 연산자를 통해 Promise 객체를 선..