일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 파이썬 제어문
- 넥스트js
- 도전
- Kotlin 클래스
- Kotlin 조건문
- Kotlin If
- django virtualenv
- Kotlin Class
- 클래스 속성
- 자바 기본타입
- 좋은글
- 파이썬
- 희망
- 다중조건문
- Variable declaration
- Python Class
- NextJs
- 파이썬 반복문
- python Django
- 파이썬 클래스
- Kotlin else if
- 성공
- github
- Kotlin 클래스 속성정의
- activate 오류
- git
- 강제 타입변환
- 파이썬 장고
- 장고 가상환경
- Python
- Today
- Total
목록Web Devlopment/JavaScript (19)
키모스토리

arrow function함수 표현식보다 단순하고 간결한 문법으로 함수를 만들 수 있는 방법// Before Arrowlet sum1 = function(a, b) { return a + b;};console.log(sum1(10, 20));// With Arrow Function:let sum2 = (a, b) => a+b;console.log(sum2(10, 20));(a, b) => a + b는 인수 a와 b를 받는 함수입니다.(a, b) => a + b는 실행되는 순간 표현식 a + b를 평가하고 그 결과를 반환합니다. 인수가 하나밖에 없다면 인수를 감싸는 괄호를 생략할 수 있습니다. 괄호를 생략하면 코드 길이를 더 줄일 수 있습니다.let double = n => n * 2;// let d..

async 함수async 키워드부터 알아봅시다. async는 function 앞에 위치합니다.async function f() { return 1;}function 앞에 async를 붙이면 해당 함수는 항상 프라미스를 반환합니다. 프라미스가 아닌 값을 반환하더라도 이행 상태의 프라미스(resolved promise)로 값을 감싸 이행된 프라미스가 반환되도록 합니다.아래 예시의 함수를 호출하면 result가 1인 이행 프라미스가 반환됩니다. 직접 확인해 봅시다. async function f() { return 1;}f().then(alert); // 1명시적으로 프라미스를 반환하는 것도 가능한데, 결과는 동일합니다. async function f() { return Promise.resolve(1)..

Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냅니다. Promise 는 프로미스가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자로, 비동기 연산이 종료된 이후에 결과 값과 실패 사유를 처리하기 위한 처리기를 연결할 수 있습니다. 프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있습니다. 다만 최종 결과를 반환하는 것이 아니고, 미래의 어떤 시점에 결과를 제공하겠다는 '프로미스(promise)'를 반환합니다.Promise는 다음 중 하나의 상태를 가집니다.대기(pending): 이행하지도, 거부하지도 않은 초기 상태.이행(fulfilled): 연산이 성공적으로 완료됨.거부(rejected): 연산이 실패함.대기 중인 프로미스..

클래스 문법// 클래스class Person { // 이전에서 사용하던 생성자 함수는 클래스 안에 // `constructor`라는 이름으로 정의합니다. constructor({name, age}) { //생성자 this.name = name; this.age = age; } // 객체에서 메소드를 정의할 때 사용하던 문법을 그대로 사용하면, // 메소드가 자동으로 `Person.prototype`에 저장됩니다. introduce() { return `안녕하세요, 제 이름은 ${this.name} 입니다.`; } } const person = new Person({name: 'Kimo', age: 33}); console.log(..

참고 문서 : https://ko.javascript.info/prototype-inheritanceconst user = { name: "Kimo", hasOwnProperty: function () { console.log('test') }}console.log(user.name);console.log(user.hasOwnProperty('name'));console.log(user.hasOwnProperty('age')); // 상속, 프로토타입, 클로저const Bmw = function(color){ const c = color; // this.color을 클로저로 은닉화 this.getColor=function() { console.log(c); ..

callcall 메서드는 모든 함수에서 사용할 수 있으며, this를 특정값으로 지정할 수 있다.const mike = { name: "Mike",};const tom = { name: "Tom",};// 해당 함수에서 접근 가능한 this가 없는 상태function showThisName(){ console.log(this.name);}showThisName(); // undefinedshowThisName.call(mike); // Mike .call() 메서드를 이용하여 this를 사용할 수 있게 됨showThisName.call(tom); // Tom .call() 메서드를 이용하여 this를 사용할 수 있게 됨function update(birthYear, occupation)..

setTimeout : 지정한 시간이 지나면 해당 함수를 1번 실행함// 함수를 따로 생성해 놓고 setTimeout 에서 호출function fn(){ console.log(3);}setTimeout(fn, 3000);// setTimeout 을 익명 함수를 이용하여 작업을 바로 지정 setTimeout(function(){ console.log(5)}, 5000);// setTimeout 인수 전달방법function showName(name){ console.log(name);}setTimeout(showName, 3000, 'Mike'); // 함수, 시간, 인수// 예정된 타이머를 취소를 위해 setTimeout을 변수에 저장const tId=setTimeout(showName, ..

arguments - 함수로 넘어 온 모든 인수에 접근 - 함수 내에서 이용 가능한 지역 변수 - lenght / index 를 가짐 - Array 형태의 객체 - 배열의 내장 메서드 없음 (forEach, map 사용안됨) function showName(name){ console.log(arguments.length); console.log(arguments[0]); console.log(arguments[1]);}showName('Mike', 'Tom');// 2// Mike// Tom 나머지 매개변수 (Rest parmeters) ... 으로 표현function showName(...names){ console.log(names);}showName(); showNa..

구조 분해 할당 (Destructuring assignment)- 구조 분해할당 구문은 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식let [x, y] = [1, 2];console.log(x); // 2console.log(y); // 1 배열을 분해해서 변수에 저장.let users = ['Mike', 'Tom', 'Jane'];let [user1, user2, user3] = users;console.log(user1); // 'Mikeconsole.log(user2); // 'Tomconsole.log(user3); // 'Jane let [a, b, c] = [1, 2]; // c에는 undefined 가 들어간다let [a=3, b=4, c=5] = [1,2];co..

sort() 배열 재정렬 (배열 자체가 변경됨)인수로 정렬 로직을 담은 함수를 받을 수 있음 let arr = [27, 5, 9, 14];arr.sort();console.log(arr); // [ 14, 27, 5, 9 ] -> 5,9,14,27을 예상 하였으나 문자열 정렬방식으로 정렬됨let arr = [27, 5, 9, 14];arr.sort((a, b)=> { console.log(a, b); return a - b;});console.log(arr); // [ 5, 9, 14, 27 ] reduce()인수로 함수를 받음 (누적 계산, 현재값) -> {return 계산값};let arr = [ 1, 2, 3, 4, 5 ];// 배열의 모든 수 합계let result =0;arr.for..

arr.sort() 배열 재정렬, 배열 자체가 변경됨인수로 정렬 로직을 담은 함수를 받음let arr = [1, 5, 4, 2, 3];arr.sort();console.log(arr); // [ 1, 2, 3, 4, 5 ]let arr = ["a","c","d","b","e"];arr.sort();console.log(arr); // [ 'a', 'b', 'c', 'd', 'e' ] 주의 - 숫자값 배열을 정렬했으나 문자열로 변환하여 정렬을 처리함let arr = [27, 5, 9, 14];arr.sort();console.log(arr); // [ 14, 27, 5, 9 ]

배열의 기초선언 및 초기화const array_name = [item1, item2, ...]; const 키워드로 배열을 선언하는 것이 일반적입니다 .const cars = ["Saab", "Volvo", "BMW"]; 공백과 줄 바꿈은 중요하지 않습니다. 선언은 여러 줄에 걸쳐 있을 수 있습니다.const cars = [ "Saab", "Volvo", "BMW"]; 배열을 생성한 다음 요소를 제공할 수도 있습니다.const cars = [];cars[0]= "Saab";cars[1]= "Volvo";cars[2]= "BMW"; new 키워드로 배열 선언 방법const cars = new Array("Saab", "Volvo", "BMW"); new 키워드 사용보다는 아래 처럼 선언하는..