목록자바스크립트 (26)
바르고 뜨겁게
Vanilla JS - Array.includes배열안에 특정 argument가 포함되어 있는지 검사한다. const numbers = [153, 8, 45, 68, 4153, 5, 8541, 635, 153, 3, 5, 1, 85, 1, 3, 5, 85]; if(numbers.includes(153)){ console.log('153 존재'); }else{ numbers.push(153); // 배열에 추가함 } 153 존재
Vanilla JS - Array.filterarray.filter : 배열의 각각의 argument 에 Function 실행하고 true를 리턴할 경우만 배열로 만든다 const numbers = [153, 8, 45, 68, 4153, 5, 8541, 635, 153, 3, 5, 1, 85, 1, 3, 5, 85]; // 10보다 큰 argument 가 리턴됨 const biggerThan10 = numbers.filter(number => number > 10); console.log(biggerThan10); // 5를 제외한 argument 가 리턴됨 const del5 = numbers.filter(number2 => number2 !== 5); console.log(del5); [..
Vanilla JS - Array.maparray.map : 배열내의 각각의 argument 에 function을 [실행] 후 [return]return 을 해줘야 값이 저장된다. const days = ["Mon", "Tue", "Wed", "Thurs", "Fri"]; // 리턴 없음 const temp = days.map(newArray => console.log(newArray)); console.log("temp : ", temp); // 각각의 배열 파라미터에 happy를 추가하여 리턴 const smilingDays = days.map(newArray => `happy ${newArray}`); console.log("smilingDays : ", smilingDays); //..
Vanilla JS - classes (자바스크립트 객체 지향 프로그래밍) 프로그래밍 패러다임함수형 프로그래밍(Functional Programming)객체 지향 프로그래밍(OOP-ObjectOrientedProgramming) ES6 부터 자바스크립트에서 객체 지향 프로그래밍이 가능하다. class Human{ constructor(name, lastName){ this.name = name; this.lastName = lastName; } } // Human 상속 const myName = new Human("Right","Hot"); console.log(myName); console.log(myName.name); console.log(myName.lastName); class Bab..
오브젝트에서 변수꺼내기 (비구조화 할당 Object Destructuring)1. 변수명 변경해서 꺼내기2. 오브젝트 변수명으로 받3. 배열 형태로 꺼내기 const obj = { depth1_0: "1단계 0", depth1_1: "1단계 1", depth1_2: { depth2_0: "2단계 0", depth2_1: "2단계 1" } } // 기존방식 const oldDepth1 = obj.depth1_0; const oldDepth2 = obj.depth1_2.depth2_0; console.log(`기존방식 oldDepth1: ${oldDepth1} / oldDepth2: ${oldDepth2}`); // (비구조화 할당 Object Destructuring) // 변수명변경 , 그대로..
자바스크립트에서 YouTube REST API JSON으로 받아오기https://console.developers.google.com/Youtube Data API v3 추가Youtube Data API v3 관리 > 사용자 인증정보상단 CREATE CREDENTIALS > API 키 생성생성된 API KEY 사용 1. Youtube Data API v3 추가https://console.developers.google.com/ 접속프로젝트 생성.라이브러리 선택 YouTube Data API v3 추가 2. Youtube Data API v3 관리 > 사용자 인증정보 상단 CREATE CREDENTIALS > API 키 생성 3. 자바스크립트 YouTube REST API 사용 예제자바스크립트에서 YouT..