자바스크립트 문법정리 8 [ promise ]
2022. 5. 22. 03:26
자바스크립트
Promise를 들어가기전에 여러개의 콜백함수를 통해 고차함수를 만들게되면 첫째함수(()=>{ 둘째함수(()=>{ 셋째함수(()=>{ }) }) }) 이런식으로 어지러워지게되는데 코드가 더러워지는 콜백함수의 문제점을 해결하기 위해 나온게 바로 Promise 코드 디자인패턴 Promise가 어떻게 돌아가는지 봅시다 저런 위에 어지러운 코드가 var 프로미스 = new Promise() 프로미스 .then(function(){//프로미스가 성공일 경우 실행할 코드 }) .then(function(){ })//이렇게 하면 옆으로 길어지지않아서 좋음\ 이렇게 간단하게바뀝니다 또 몇개의 메소드가있는데 var 프로미스 = new Promise() 프로미스.catch(function(error){//실패할경우 }) ..
자바스크립트 문법정리 7 [구조 분해 할당 (Destructuring) ]
2022. 5. 22. 03:15
자바스크립트
Destructuring이란? 자리맞추기라고 생각하면됍니다. 예제를 통해 살펴봅시다. 아주 중요한 자료들을 전부 변수에 담으려면? var arr= [2,3,4]; var [a,b,c] = [2,3,4];//변수 세개를 만드는데 2랑 3이랑 4라는데이터를 집어넣어주세요 arr destructuring 할때 몇개를 빼먹는다면? var [a,b,c = 10] = [2,3];//등호로 기본값 지정가능 //이렇게하면 c는 10이나옴 or 아예 아무것도 할당을안하면 [] 이렇게 undifined라고뜸 obj 데이터를 꺼내 변수에 담으려면? var obj = {name: 'kim' , age: 30}; var name = obj.name; var age = obj.age; 자리맞추기라고했는데 어떤거냐면 var { n..
자바스크립트 문법정리 6 [ getter, setter]
2022. 5. 22. 02:37
자바스크립트
원래 처음에 객체 만들때 어떻게함? let 사람 = { name: 'park', age: 30, nextAge(){//내년 age 아는 방법 this ==사람 object return this.age +1; }, setAge(나이){//나이수정하는 함수 return this.age = parseInt(나이); } } 사람.age; 사람.nextAge();//그냥 위에꺼에 +1하면 더하면되는데 왜만들었음? //1.object 자료가 복잡할때 이득 //2.object 자료 수정시 편리,실수방지,관리가능 ex)데이터 수정시 미리 검사가능1.문자열을 입력했을수도있잖아요? 사람.setAge(20)//데이터 수정해주는 함수를 제작 이렇게 만듬 But 복잡한소괄호가 싫다면 let 사람2 = { name: 'park'..
자바스크립트 문법정리 5 [constructor ]
2022. 5. 22. 02:28
자바스크립트
constructor(기계)란? var 학생1 = { name : 'Kim', age : 15 }; var 학생2 = { name : 'Park', age : 15 }; ... 학생 출석부 이렇게하드코딩하면 힘들겠죠? 그래서 아래처럼 함수 기계를 만들어서 안에 값들을 집어넣습니다. function 기계(){ this.name='Kim', this.age=15, sayHi :function(){ console.log('안녕하세요' + this.name + '입니다') } } //this는 새로 생성되는 object를 뜻함 //this.age=15; //새로 생성되는 oject 에 값 부여가능 function 기계(이름,나이){ this.name=이름, this.age=나이, this.sayHi =funct..
자바스크립트 문법정리 4 [rest, spread]
2022. 5. 22. 02:16
자바스크립트
이 두가지 문법은 구조분해할당할때 많이사용합니다. 구조분해할당이란? 갇혀있는녀석들을 풀어줘서 사용하게끔 다시 할당하는것! 1.rest "객체에서 괄호벗기는녀석" function 함수2(...파라미터들){ console.log(파라미터들) } 함수2(1,2,3,4,5,6,7); 위 코드를 실행해보면 파라미터들이라는 변수를 출력해줍니다. 파라미터들이라는 변수는 모든 파라미터를 [] array 안에 담고 있습니다. 이게 바로 ES6 환경에서 쓸 수 있는 rest 파라미터입니다. 원하는 파라미터 왼쪽에 ... 기호를 붙여주시면 "이 자리에 오는 모든 파라미터를 [] 중괄호로 감싸준 파라미터" 라는 뜻입니다. 그래서 출력해보면 저렇게 [1,2,3,4,5,6,7]이 나오는 것이고요. 그 자리에 입력한 모든 파라미터..
자바스크립트 문법정리 3 [변수 ,Reference Data Type ]
2022. 5. 22. 02:03
자바스크립트
자바스크립트는 총 세개의 변수가있는데 그차이를 살펴보도록합시다. 변수선언방식 var 이름;//재선언 o 재할당 o 범위 function let 나이;//재선언 x 재할당 o 범위 { } const 성별= 0;//재선언 x 재할당 x 범위 { } 1.재선언 var 이름 = 1; console.log(이름) //1 var 이름 = 2 console.log(이름)//2 var같은 애들은 다시선언해줘도 따로도는 속성을 가지고있습니다. 변수이름이 같아서 헷깔리는 문제가 많이생기겠죠 그래서 나온게 let ,const 입니다 애네들은 재선언x 2.재할당 var 변수 = 1; 변수 =2; console.log(변수);//2 let 변수2 = 3; 변수2 = 5; console.log(변수2)//5 const 변수3 =..