JavaScript 33

js chorme app

event.preventDefault(); //event의 기본동작을 막아준다. loginForm.classList.add(HIDDEN_CLASSNAME); //loginForm에 hidden이라는 클래스 이름을 넣어준다. const username = loginInput.value; //username에 value값을 넣어준다. greeting.innerText = `Hello ${username}`;//greeting에 text를 넣어준다. greeting.classList.remove(HIDDEN_CLASSNAME); //class이름을 삭제해준다. localStorage.setItem("key", "value"); //를 통해서 key,value값을 검사 ->application->안에 저장할 수..

JavaScript 2021.12.28

HTML in JS

const text = document.getElementById -> id로 찾아서 값출력 document.getElementsByClassName ->claa로 찾아서 값출력 text.innerText="" //innerText를 이용해서 값을 변화시킬 수 있다. getElementById() getElementsByClassName() getElementsByTagName() 이렇게 자바스크립트를 통해 HTML을 가져올 수 있는 것이 크게 세가지 있음 이중에서 querySelector를 가장 많이 쓸 것임 getElementById() : 말 그대로 id , 하나의 값을 반환해줄때 쓴다 getElementsByClassName() : 클래스 네임을 가져옴, array에 할당 getElementsBy..

JavaScript 2021.12.22

js 데이터타입

[데이터타입] var 은 더이상 쓰지 않는다. 선언하기도 전에 사용 가능함, 블럭 선언을 무시한다. var hoisting 어디다 선언하든 항상 제일 위로 선언을 올려준다. let 사용! (Mutable) const (Immutable) const 한번 할당하면 값이 변하지 않는다. 보안성이 좋다 한번 선언하고 변경될 일이 없다면 const로 선언하는게 좋다. variable types primitive(single item) : number, string, boolean, null, undefiedn, symbol object, box container

JavaScript 2021.12.08

정규 표현식

정규표현식 with JavaScript 정규표현식이란 문자열을 검색하고 대체하는 데 사용 가능한 일종의 형식 언어(패턴)입니다. 간단한 문자 검색부터 이메일, 패스워드 검사 등의 복잡한 문자 일치 기능 등을 정규식 패턴으로 빠르게 수행할 수 있습니다. 정규표현식은 크게 다음과 같은 역할을 수행합니다. 문자 검색(search) 문자 대체(replace) 문자 추출(extract) 정규표현식 테스트 사이트 https://regex101.com/ https://regexr.com/ https://regexper.com/ 자바스크립트 정규식 생성 생성자 함수 방식 RegExp 생성자 함수를 호출하여 사용할 수 있습니다. const regexp1 = new RegExp("^abc"); // new RegExg(표..

JavaScript 2021.10.25

OMDb API

주소를 통해서 영화 정보를 요청 http://www.omdbapi.com/ OMDb API - The Open Movie Database www.omdbapi.com Query String 주소?속성=값&속성=깂&속성=값 //주소를 입력할때 옵션을 입력 ?apikey S= 영화제목 http://www.omdbapi.com/?apikey=7035c60c&s=frozen apikey 를 입력하고 s에 겨울왕국을 입력 이러한 창이 나온다. axios 패키지 $ npm install axios 명령어로 설치 import axios from "axios"; //패키지 가져오기 function fetchMovies() { axios .get('https://www.omdbapi.com/?apikey=7035c60c..

JavaScript 2021.10.25

json, storage

JSON(제이슨, JavaScript Object Notation)은 속성-값 쌍( attribute–value pairs and array data types (or any other serializable value)) 또는 "키-값 쌍"으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷이다. 비동기 브라우저/서버 통신 (AJAX)을 위해, 넓게는 XML(AJAX가 사용)을 대체하는 주요 데이터 포맷이다. 특히, 인터넷에서 자료를 주고 받을 때 그 자료를 표현하는 방법으로 알려져 있다. 자료의 종류에 큰 제한은 없으며, 특히 컴퓨터 프로그램의 변수값을 표현하는 데 적합하다. json은 큰 따움표만 가능하다. " " //json import myDat..

JavaScript 2021.10.25

lodash 매소드[uniqBy, unionBy, find, findIndex, remove]

uniqBy : 배열데이터 한개 unionBy : 배열 데이터 여러개 import _ from 'lodash' const usersA = [ {userId:'1', name : 'HEROPY'}, {userId:'2', name : 'Neo'} ] const usersB = [ {userId:'1', name : 'HEROPY'}, {userId:'3', name : 'Amy'} ] const usersC = usersA.concat(usersB) //두개의 배열 데이터를 합쳐서 새로운 배열을 반환 console.log('concat',usersC) //0: {userId: '1', name: 'HEROPY'} //1: {userId: '2', name: 'Neo'} //2: {userId: '1', n..

JavaScript 2021.10.25