개발이 좋아서/JavaScript가 좋아서

js - 에러 핸들링

에러 핸들링 try...catch문법 try { 코드작성 } catch(e) { 코드작성 }

js - 모듈

분리된 파일 export 지시자 외부모듈에서 해당 변수나 함수에 접근할 수 있도록 함(모듈 내보내기) import 지시자 외부모듈의 기능을 가져와서 사용할 수 있음(모듈 가져오기)

js - canvas

canvas 1. html에 canvas태그 추가하기 canvas에 너비와 높이가 지정되지 않으면 300px 150px 2. javascript - getContext()메소드 캔버스의 드로잉 컨텍스트를 반환해줌 1) 사각형 그리기 fillRect(x,y,width,height) 채워진 사각형 그리기 strokeRect(x,y,width,height) 선으로 된 사각형 그리기 clearRect(x,y,width,height) 지정된 사각형 영역을 지움 2) 패스 그리기 beginPath() 새 경로를 만듬 closePath() 마지막 위치에서 시작 위치를 연결 stroke() 윤곽선 그리기 fill() 칠하기 moveTo(x,y) 지정된 위치에서 시작한다.(펜툴의 시작점) rightTo(x,y) x,y ..

js - 비동기 처리

동기적처리(Synchronous) 비동기적처리(Asynchronous) 1. 콜백함수 2. Promise 자바스크립트에서 제공하는 비동기를 간편하게 처리할 수 있도록 도와주는 오브젝트입니다. 기능을 수행하고나서 정상적으로 기능이 수행되면 성공의 메세지와 처리된 결과값을 전달 수행하다가 예상치 못한 결과가 생기면 에러를 전달해줍니다. 프로미스 상태 state : promise가 수행중이면 pending 수행이 종료되면 fullfilled 수행중 오류가 발생 rejected 프로듀서와 컨슈머 프로듀서 : promise 제공 컨슈머 : promise 사용

js - JSON(javascript object notation)

JSON(javascript object notation) 서버와 데이터를 전송할 때 사용되는 데이터 포맷. 자바스크립트의 객체를 보고 만든 데이터 포맷. 텍스트를 기반으로 하여 가벼움 데이터를 직렬화하여 전송할 때 쓰임 프로그램 랭귀지나 플랫폼에 상관없이 쓸 수 있음. XML -> JSON 자바스크립트 객체 -> 직렬화 json json -> 자바스크립트 객체 1. object to JSON JSON.stringify(obj) 2. JSON to Object JSON.parse(json)

js - 클래스(복습)

class Person { name; age; speak(); } class Person { constructor(name,age){ this.name = name; this.age = age; } speak(){ console.log(`${this.name}: 안녕`); } }

js - 배열, 객체, 셋(복습)

let const 기본타입 number, string, boolean, null, undefined Symbol 참조형 타입 object 배열 - 순서가 있는 컬렉션 let arr = []; let arr = new Array(); let arr = [1,2,3,4,5,6,7]; arr[0] arr[1] 객체 - 키와 벨류가 있는 컬렉션 let obj = { key: value, key2: value2, key3: value3, } 객체 리터럴 방식 let obj = { name: "bella", age: 22, } 객체 생성자 방식 let user = new Object(); obj['name'] obj.name obj['isjob'] = true;

js - 로딩

로드시 이벤트 설정하기 1. window.onload = function(){ 실행문; } 2. 3. window.addEventListener("load",function(){ 실행문; }) -임의로 로딩시간 지정 setTimeout(()=>{ 실행문; }, 3000); -스피너 소스 모음 https://tobiasahlin.com/spinkit/ SpinKit Simple CSS Spinners tobiasahlin.com

js - 동기, 비동기

let timer = setInterval(함수,시간) clearInterval(timer);

js - 프로토타입

[[prototype]] 자바스크립트 객체는 [[prototype]]이라는 숨김 프로퍼티를 갖습니다. 이 숨김 프로퍼티가 다른 객체에 대한 참조가 되는데 다른 객체를 참조하는 경우 참조 타입을 프로토타입이라고 부릅니다.