본문 바로가기
HTML form 태그 submit 실행 전 다시 한번 확인 후 데이터 전달하기 JSON 파일 불러올 때가 엊그제 같은데 계획한 작업이 마무리되어 갑니다. 웹페이지를 구성하고 맨 마지막 페이지에 사용자들과 소통할 창구로 사용될 기능인 메시지 발송 폼을 추가하고자 합니다. 사용자로부터의 무분별한 메시지 발송을 걸러 내기 위해 form 태그의 submit 버튼에서 재확인하는 함수를 간단하게 작성해 봅니다. (항상 그렇듯 알고 나면 단순한데 알기 전엔 도통 이해가 안 가는 현상들이 꽤 있습니다. 에러메세지가 없는 에러가 해결하기 더 어렵습니다.) 이름, 이메일, 제목, 내용을 사용자로부터 입력받는 form 태그를 구성합니다.(form 태그를 구성하는 것만으로도 잘못 입력된 양식의 데이터(숫자, 텍스트, 이메일, 전화번호 등)를 걸러낼 수 있습니다.) form 태그로 구성된 데이터를 전송하.. 2021. 12. 13.
JSON 오브젝트 객체 파일 불러오기 - 자바스크립트(JavaScript) 지난번 비교적 간단한 웹페이지를 만들 때 사용된 오브젝트 또는 배열은 볼륨이 크지 않아 스크립트 내에서 선언하고 사용할 수 있었습니다. 지금 작업하는 스크립트에는 그보다 훨씬 큰 데이터가 필요하고, 데이터 분석을 요구하는 코딩을 하게 된다면 어쩔 수 없이 마주치게 될 JSON 파일을 자바스크립트에서 불러와 사용하는 방법에 대해 살펴봅니다.(지금까지 살펴본 바 대용량 데이터 파일은 파이썬-판다스가 정말 짱입니다.) 제 경우 엑셀로 된 자료를 JSON 타입의 오브젝트로 변환 후 data.json으로 저장하여 사용했습니다. 참고하세요~! // data.json 읽어오기 data =readTextFile("../js/data.json", function(text){ var data = JSON.parse(tex.. 2021. 12. 13.
웹 페이지 만들고 배포하기 – 자바스크립트(JavaScript) HTML로 웹 페이지를 구성하여 사용자 입력을 받은 데이터를 자바스크립트로 가공하여 특정한 값을 출력하는 간단한 웹 서비스(민망합니다.)를 만들었습니다. 자바스크립트로 사용자 입력을 제어하고 함수를 통해 계산하고 JSON 타입의 오브젝트 배열에 접근하여 자료를 참조도 해봅니다. 이번 웹 페이지를 작성하며 자바스크립트의 문법과 스크립트가 어떤 구조로 실행되는지를 조금 맛본 것 같습니다. 스크립트 언어라 쉽게만 생각했는데 자바스크립트의 장점과 단점을 모두 경험하는 좋은 계기가 되었네요. 아직 부족한 것이 많지만 그동안 작성된 스크립트를 아래와 같이 소개해 봅니다. 엑셀 데이터 몇 가지를 JSON 타입의 오브젝트 배열로 만들어 const 선언을 통해 상수를 만듭니다. 그리고 torque_calc()함수 내에서.. 2021. 12. 13.
변수 & 함수 스코프(scope)의 개념 이해 - 자바스크립트(Javascript) 스코프(scope)란 말 그대로 범위를 나타냅니다. 전역변수(Global Variable)와 지역변수(Local Variable)의 유효범위에 대해 살펴봅니다. 예를 들어 함수를 작성하고 실행할 때 함수 내에서 계산된 값을 굳이 retrun이라는 명령어로 전역에 반환하는 이유는 함수 내에서 정의된 변수는 지역변수이기 때문입니다. 전역변수로 정의된 변수는 함수 내외부 어디에서나 사용할 수 있지만 함수 내에서 정의된 변수 또는 함수(함수 내의 함수)는 해당 함수의 범위 안에서만 사용할 수 있는 점이 다릅니다. var score=100, global_var=1; function my_func(){ var score=50; console.log(score, global_var); } my_func(); // 5.. 2021. 12. 13.