coding with cong

비동기통신 asynchronous communication : AJAX를 가장 많이 사용 데이터를 받는 방식(통신) : 동기통신 / 비동기통신 동기 통신(synchronous) : 동시에 일어나는 요청을 하면 (바로)응답을 받는다는 의미 단점) 하나의 업무가 끝나야 다음 업무가 시작됨 = 결과가 주어지기 전까지 아무것도 못하고 대기 장점) 설계가 간단하고 직관적 비동기 통신(asynchronous) : 동시에 일어나지 않음 요청을 하고 응답을 받는 시간이 걸림 즉, 요청한 그 자리에서 결과가 주어지지 않을 수 있음 작업에 대한 모션이 별개로 이루어짐! 장점) 요청한 업무의 결과가 나오지 않아도, 다른 업무를 보는 것이 가능 예) 아이디 중복체크 : 아이디를 중복체크하는 동안, 타 입력을 할 수 있도록 함..

함수와 파라미터 (arguments) : 자바스크립트의 파라미터 특징과 기능 파라미터의 개수와 관계없이 함수나 메서드의 이름이 같다면 호출가능 파라미터의 개수와 불일치하여 값을 받지 못하는 파라미터는 undefined 처리 값을 받아오지 못하는 파라미터가 undefined 일 경우, 별도로 파라미터에 기본값을 설정할 수 있음 => optional parameter 옵셔널 파라미터 모든 파라미터를 관리하는 arguments라는 프로퍼티를 이용하여 파라미터를 배열에 담아 사용할 수 있음 프로토 타입의 속성(프로퍼티)을 사용하는 방식 (단, 옵셔널 파라미터는 저장하지 않는다) 옵셔널 파라미터는 다른 파라미터보다 항상 뒤에 있어야함 사용 function testFun(p1, p2, p3, p4, p5=1){ c..

JSON : Javascript Object Notation 자바스크립트 객체 표기법 데이터 요청 및 응답처리에 필요한 데이터의 표준형식을 제공하는 타입 백앤드(서버)언어의 종류에 상관없이 데이터 송수신 단일 형식으로 통일 많은 양의 데이터를 실시간으로 전송하는 경우 사용 자바스크립트의 객체 형태를 갖고 있기떄문에 구조파악이 잘되고, 제작도 쉽다 ( 특히 웹 분야의 자바스크립트가 모든 프론트에 호환된다는 점을 활용 ) 입출력시에는 JSON을 사용! 왜? 데이터의 전송은 전부 String타입으로 이루어짐 서버로 데이터를 보낼때 : json to string > JSON.stringify(jsObject); 서버로부터 데이터를 받을때 : string to json > JSON.parse(stringData)..

class, 객체, 생성자 객체를 생성할 때, 생성자를 넣지 않는 경우 undefined로 출력 객체 생성 후, 객체 설정 추가가능! (굳이 생성자를 자세히 만들 필요 X) 생성자는 자바스크립트 하나에 오직 하나만 허용!! 예시 예) 은행 - 입금/출금/이체 https://jungeun980906.tistory.com/214 예) 생성자 함수이용 클래스 생성 생성 // 클래스생성 class Car{ // 생성자 생성 : 자바스크립트에서는 생성자는 오직 1개! 허용 constructor (name, year){ this.name = name; this.year = year; this.model = ''; } } // 객체생성 let myCar1 = new Car('쏘나타', 2022); let myCar2..

try~catch : 예상되는 에러를 try{code..} 영역에 배치하고, 만약 에러가 발생하면 catch(err){code...} 영역에서 처리하는 예외처리 프로세스 try영역 : 에러발생 가능성이 있는 코드를 실행하는 곳 catch(err) 영역 : 에러발생시 예외 처리를 하는 곳 try_catch로 예외 처리를 하면, 프로세스를 멈추지 않고 지속시킬 수 있음 finally 영역 : 예외처리와 관계없이 무조건 코드를 실행하는 영역 throw : 예외를 고의적으로 발생시키는 키워드 throw + 예외발생 후 처리할 코드 사용 예시 ) alert => alerttt 오류 console.log('프로세스 시작'); try{ alerttt('경고창 실행'); //명령어가 잘못된 부분 console.log(..

set : 자바스크립트의 데이터 타입의 확장 개념 집합데이터를 다룰수 있는 객체 중복 데이터 허용X : 중복데이터가 들어오면 체크 후 하나만 남김 set() : 파라미터는 주로 배열을 사용 배열의 index, value 값을 활용하여 집합 데이터를 만듬 set 전용 메서드들이 있음 getter,setter가 없기때문에 forEach를 이용해 접근해야함 set 객체 생성 및 초기화 new set( ) new set( array ) 예) const testSet = new Set(['html', 'css', 'js']); 사용예시 로또번호 생성 : https://jungeun980906.tistory.com/215 set.add( value ) 데이터 추가 set.delete ( value ) 데이터 삭제 ..

map : key / value 형태의 데이터를 한개의 배열로 만들어서 다시 배열에 저장하는 방식 기본적으로 중첩구조를 가지고 있기때문에 key중복확인 필수! key를 식별자로 사용하기 때문에 중복x get (KeyName, value) 메서드 제공 2차원 배열 형태와 비슷한 구조 key의 타입은 문자로 하는 것이 원칙 = key의 타입이 달라지면 관리 어려움 객체의 속성명도 문자로 하는 것이 원칙 선언 및 초기화 new Map(); new Map( [ 'key' , 'value' ] , [ 'key1' , 'value1' ] ... ); 예시 https://jungeun980906.tistory.com/212 (과목, 점수를 map에 저장하고 합계,평균 등을 출력) 과목, 점수를 map에 저장하고 합계..

1. 버튼에서 바로 새로고침하는 경우 : window.location.reload(); 다시하기 2. function함수안에서 사용하는 경우 : location.reload(); 다시하기 //버튼 : 다시하기 function reset(){ location.reload(); }

데이터 구조화 (구조화된 텍스트) : 많은 량의 데이터가 실시간으로 전달되어야 하는 경우, 가장 효율적 방식 구조화된 텍스트를 만들기위해 json 데이터를 많이 활용함 자바스크립트의 객체 형태를 갖고 있음 = 구조파악이 잘되며, 제작이 쉬움 특히! 웹 분야의 자바스크립트가 모든 프론트에 호환된다는 점을 활용 데이터수집, 출력용으로 거의 모든 플랫폼 서비스에서 사용중 사용 예시 ) 네이버 증권 폼 const top = { exchange: [ { name: '미국USD', price: 1313.10, updown: 6.10 }, { name: '일본JPY(100엔)', price: 980.11, updown: 2.80 }, { name: '일본JPY(100엔)', price: 980.11, updown: ..

정규식 Regular Expression : 문자열에서 특정 내용을 찾거나 대체, 발췌하는데 사용 regex 단어로 많이 표현됨 특정데이터를 탐색, 확인, 존재여부 등을 쉽게 확인하기 위한 규칙 웹 분야 ) password 작성규칙, 첨부파일등에 사용 (자주사용x) 데이터 분석 분야 ) 반드시 알아야함 타 언어에서도 비슷한 형식 (알고있으면 편리) 작성규칙 / regexr / i // : 시작, 종료기호 regexr : pattern 패턴 i : flag flag옵션 i : 대소문자 구분x g : 전체 검색 m : 문자열의 행이 바뀌어도 검색 (행바꿈도 포함 검색) - 붙여서 2개사용도 가능 a-zA-Z : 영어 알파벳 전체포함 ㄱ-ㅎ가-힣 : 한글 전체포함 0-9 : 숫자 전체포함 . : 모든 문자열 ..