본문 바로가기

JS

(26)
#JS복습 - 자바스크립트 화살표 함수, 배열메소드, map자료형 화살표함수 연습하기 1 function add (a,b,c,d,e) { return a+b+c+d+e; } let addArrow = (a,b,c,d,e) =>{ //화살표함수! 위와 동일한 기능 return a+b+c+d+e; }; let result = 0; result = addArrow(1,2,3,4,5); console.log(result); 배열 메소드 let arr1 = new Array(1,2,3); //1번째 방법 let arr2 = ["1","2","3"]; // 빈 배열을 선언 console.log(arr1); console.log(arr2); let arr2D = [ [1,2,3], [4,5,6], [7,8,9] ]; console.log(arr2D[1][1]); //5 출력 /* ..
#자바스크립트 스터디 8 - 클로저, setTimeout, call/apply/bind *변수와 호이스팅, 함수 선언문 특징에 대한 선행 학습이 필요함 Clousure //closure functon makeCOunter(){ let num = 0; //은닉화 return function() { //위의 num! 외부함수의 변수임 return num++; } } let counter = makeCounter(); console.log(counter()); //0 cousole.log(counter()); //1 console.log(counter()); //2 실행할수록 변수의 값을 기억하여 계산됨 setTimeout / setInterval 일정시간이 지나고 함수를 실행 일정기간동안 함수를 반복 setTimeout(함수, 시간, 인수) clearTimeout : 예정된 작업을 지운다. 스..
#자바스크립트 스터디 7 - 배열 구조 분해, 나머지 매개변수, 전개구문 배열구조분해 //배열 구조 분해 let users = ['Mike', 'Tom', 'Jane']; let [user1, user2, user3] = users; //위 두 배열은 동일한 개념이다. //let user1 = users[0]; //let user2 = users[1]; //let user3 = users[2]; 구조분해 할당을 이용해 순서대로 할당됨 //배열 구조 분해 let str = "Mike-Tom-Jane"; let [user1, user2, user3] = str.split('-'); console.log(user1); console.log(user2); console.log(user3); 배열구조분해 : 바꿔치기 let a = 1; let b = 2; let c = a; //임시 ..
#자바스크립트 스터디 6 - 배열메소드2 arr.sort() *정렬할 때 문자열로 취급하기 떄문에, 숫자가 들어가면 이상하게 정렬된다. 숫자를 정렬하기 위해서는 아래와 같이 정렬이 필요함 //arr.sort() 배열 재정렬, 배열 자체가 정렬됨 // 인수로 정렬 로직을 담은 함수를 받음 let arr = [27,8,5,13]; arr.sort((a,b)=>{ console.log(a,b); return a-b; }); //원본기준 정렬 로직 이해 //8,27 : 8,27,5,13 //5,8 : 5,8,27,13 //13,5 : 5,8,27,13 //13,8 : 5,8,27,13 //13,27 : 5,8,13,27 정렬완료 console.log(arr); ㄴ a와 b를 비교해서 양수가 나오는지, 음수가 나오는지 확인하여 정렬 내부 로직이 작동함 ..
#자바스크립트 스터디 5 - 배열메소드1 arr.splice(n, m) : 특정 요소를 지움 (n부터 m개 지워) arr.splice(n, m, x) : n부터 m개 지우고 x 추가해 let arr = [1,2,3,4,5]; arr.splice(1,3,100,200); //1부터 3까지 지우고 100, 200 넣어 console.log(arr); ㄴ 배열 내에 값을 추가할 때 순서를 넣을 수 있다. let arr = ["나는", "철수", "입니다."]; arr.splice(1,0,"대한민국", "소방관"); console.log(arr); //나는 대한민국 소방관 철수 입니다. 순서로 삽입 가능 ㄴ삭제된 요소들을 반환한다. arr.slice(n.m) : n부터 m까지 반환한다. *m은 포함하지 않고 바로 앞자리까지 반환한다. let arr =..
#자바스크립트 스터디 4 - Math 메소드, 문자열 메소드 숫자, 수학 메소드 toString() : 10진수를 -> 2, 16진수로 변경할 때 let num = 10; console.log(num.toString(2)); console.log(num.toString(16)); Math 객체 안의 메소드 Math.ceil() : 올림 Math.floor() : 내림 = 버림 Math.round() : 반올림 소수점 자릿수 : toFixed() let num = 10.12341; console.log(num.toFixed(2)); toFixed는 "문자열"을 반환한다. Number() 을 통해 변환이 필요하다!! 소숫점 몇째 자리까지 나타낼지 괄호 안에 입력함 isNaN() : NaN인지 아닌지 확인한다. parseInt() : 문자열을 숫자로 바꿔준다. //pa..
#자바스크립트 스터디 3 - 객체 메소드(assign, keys 등), Symbol 데이터 컴퓨티드 프로퍼티 (Computed property) let a = 'age'; const user = { name : 'Mike', [a] : 30; // [a] 에는 선언되었던 변수의 값이 들어간다. 이게 컴퓨티드 프로퍼티 } 객체 메소드 1. Object.assign() : 객체 복사 //Object.assign() : 객체 복제 const user = { name : 'Mike', age : 30 } const newUser = Object.assign({}, user); //빈 객체에 복사가 된다. //{}에 초기값을 넣어줄 수 있다. //newUser과 user은 동일한 객체가 아님!! const newUser2 = Object.assign({gender = 'male'}, user); //g..
#자바스크립트 스터디 2 - 변수, 객체, 생성자함수 var var는 선언하기 전에 사용할 수 있다. (호이스팅) 할당은 호이스팅 되지 않는다. undefined let let과 const도 호이스팅 되지만, var처럼 동작하지 않는다. Temporal Dead Zone 때문에 TDZ의 영향을 받아 할당하지 않으면 선언되지 않음 변수의 생성 과정 var 1. 선언 및 초기화 단계 ㄴ 동시에 진행되기 때문에, 할당 전 호출하면 undefined 나옴 2. 할당 단계 let 1. 선언 단계 2. 초기화 단계 const 1. 선언 + 초기화 + 할당 단계 ㄴ 선언하면서 바로 할당 필요 스코프 var : 함수스코프 ㄴ 함수 내에서 선언된 변수는 함수 내에서만 사용 가능 let, const : 블록스코프 ㄴ 선언된 블록 내에서만 사용 가능 생성자 함수 리터럴된 객체..