const regexpEmail = /^([a-z]+\d*)+(\.?[a-z]*)+@[a-z]+(\.[a-z]{2,3})+$/; if (!regexpEmail.test(email)) { return alert("올바른 형식의 Email을 입력하세요."); } 정규식과 조건문에는 아무런 문제가 없었다. 다시 보고 또다시 봐도 그랬다. 그런데 왜 정규식에 부합하는 input값을 넣어도 [그림 1]과 같이 alert이 뜨는 것일까? 황당하게도 email 관련 DOM 처리 시 trim함수에 ()를 붙이지 않아서였다. const email = document.querySelector("#email").value.trim; // .trim -> .trim() console.log를 찍어보니 입력한 email 값이 ..

Vue.js 프로젝트를 Node.js 서버와 연동하고 있다. MySQL DB의 데이터를 수정하는 기능을 구현하는데 [그림 2]와 같이 status 값이 넘어오지 않는 문제가 있었다. 아래 코드는 DB 데이터를 수정하기 위한 doSave() 함수인데 데이터를 성공적으로 수정하여 status 값 200이 뜨면 if 조건문을 실행하도록 하였다. doSave() { this.$swal({ title: '카테고리 정보를 수정 하시겠습니까?', // text: "You won't be able to revert this!", icon: 'warning', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', cancelBu..

"카이 호스트만. (2021). 무던한 개발자를 위한 모던한 자바스크립트(우정은, 역). 한빛미디어" 위 책 60쪽 01번 연습문제 풀이 후 잘 기억해야 할 내용이라 판단되어 정리하였다. + 연산자를 정수에 사용 + 연산자를 정수에 사용하면 산술 연산자로 작동하며, 결과는 다음과 같다. > 0+NaN 0+Infinity 0+undefined 0+false 0+true 0+null ''+NaN ''+Infinity ''+undefined ..

Github의 프로젝트를 다른 PC에서 pull 한 후 서버를 실행했는데 실패했다. C:\\Users\\user\\Documents\\GitHub\\bootcamp\\vue\\project02>npm run serve > project02@0.1.0 serve > vue-cli-service serve 'vue-cli-service'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. .gitignore된 폴더와 파일 때문일거라 보고 npm install을 실행했는데, "npm ERR! code ERESOLVE..." 에러가 발생했다. C:\\Users\\user\\Documents\\GitHub\\bootcamp\\vue\\project02>npm install npm..

"고경희. (2021). Do it! 자바스크립트 입문. 이지스퍼블리싱", 이 책은 자바스크립트 "입문자"에게 훌륭한 선택이다! 9, 10장을 통해 다지게 된 점은 다음과 같다. 9장 폼 1) name 값을 사용해 폼 요소 안에 있는 텍스트 필드에 접근하려면 의 name값과 텍스트 필드의 name값을 사용한다. document.의 name값.텍스트 필드의 name값 document.forms["의 name값"].elements["텍스트 필드의 name값"] // 이렇게도 접근할 수 있다. 2) id, class, name 속성도 없을 경우 폼 배열을 사용해 폼 요소에 접근할 수 있다. document.forms[0].elements[0].value // 현재문서의.첫 번째 form의.첫 번째 요소의.값 ..

"고경희. (2021). Do it! 자바스크립트 입문. 이지스퍼블리싱", 자바, 파이썬을 공부한 적이 있다. 그래서 자바스크립트를 배울 때도 웬만한 문법의 개념은 익숙했다. 하지만 DOM은 낯설다. 다른 책을 통해 이를 먼저 접했는데 상당히 많은 내용을 담고 있었다. 그게 장점일 수 있지만 처음 배우는 입장에서는 중압감이 컸다! 반면 이 책은 핵심만 간결하게 잘 담은 인상이다. 잘 구조화되어 있어 기억도 잘 된다. 차근차근 따라가다 보면 어느새 quiz-2를 풀고 있다. 8장을 통해 다지게 된 점은 다음과 같다. 8장 문서 객체 모델(DOM) 1) DOM - 웹문서의 모든 요소를 자바스크립트를 이용하여 조작할 수 있도록 객체를 사용해 문서를 해석하는 방법. 2) DOM 트리 표현 - 태그: 요소 노드 ..

"고경희. (2021). Do it! 자바스크립트 입문. 이지스퍼블리싱", 6장, 7장을 통해 다지게 된 점은 다음과 같다. 6장 객체 1) 자바스크립트 객체 종류: 내장 객체, 문서 객체 모델(DOM), 브라우저 객체 모델, 사용자 정의 객체 2) 자바스크립트 = 프로토타입 기반 언어(prototype-based language). 객체 간의 상속 관계를 프로토타입 체인(prototype chain)이라고 한다. 프로토타입을 사용해 만들어낸 객체를 '인스턴스(Instance) 또는 개별 객체'라고 한다. 3) Math 객체는 new 예약어를 통해 객체의 인스턴스를 생성하지 않는다. 4) 사용자 정의 객체: "리터럴 표기법, 생성자 함수" 사용해 만든다. 5) 생성자 함수는 객체를 만들어 내는 함수로 f..

"고경희. (2021). Do it! 자바스크립트 입문. 이지스퍼블리싱", 4, 5장을 통해 다지게 된 점은 다음과 같다. 4장 제어문 1) falsy 값으로 0, "", NaN, undefined, null은 모두 false로 인정한다. 2) do...while문은 while 조건이 false이더라도 최소한 한번은 실행된다. 3) 중첩 for문은 안쪽 for문 부터 실행된다. 5장 함수와 이벤트 1) 함수 안에서 새롭게 전역 변수를 선언하려면 변수 이름 앞에 var 예약어를 사용하지 않으면 된다. 2) var를 사용한 변수는 호이스팅(변수의 선언과 할당을 분리해서 선언 부분을 스코프의 가장 위쪽으로 끌어올리는 것)과 재선언이 단점으로 작용할 수 있다. 따라서 let을 사용하는 것을 권장한다. 3) le..