자바스크립트 22

23. [JavaScript] 논리 연산자

논리 연산자 or A or B A와 B 둘중하나가 true일때 true를 반환 and A and B A와 B 둘다 true일때 true를 반환 ! A! A가 ture이면 false를 false이면 true를 반환 or는 첫 번째 조건이 true이면 나머지 조건은 확인하지 않습니다. A or B 에서 A가 true이면 B 조건식을 확인하지 않습니다. 동일하게 and는 첫 번째 조건식 false이면 나머지 조건은 확인하지 않습니다. 아래와 같은 조건이 있을때 앞부분의 조건에서 데이터를 많이 걸러낼수록 빠르게 데이터 처리를 할 수 있습니다. || (OR) let gender = "man"; let age = 15; // 남자이거나 나이가 20살이상인 사람 if(gender === "man" || age > 1..

JavaScript 2022.01.10

21. [JavaScript] basic operator 기본연산자

basic operator 나머지(%)는 쓰임 홀수, 짝수 구분 const num = 2; if(num % 2 == 0){ alert("짝수입니다."); }else{ alert("홀수입니다."); } 특정값 제한하기 4 이상의 수를 넘기면 안 됨 X % 4 = 0 ~ 3까지의 값만 리턴함 거듭제곱 const num = 2 ** 3; console.log(num); // 8 우선순위 * / > + - 연산자 줄이기 // 연산자 줄이기 let num = 5; num += 5; console.log(num); // 10 num -= 5; console.log(num); // 5 num *= 5; console.log(num); // 25; num /= 5; console.log(num); // 5 num %=..

JavaScript 2022.01.02

20. [JavaScript] Type Conversion 형변환

Type Conversion String() > 문자형으로 변환 Number() > 숫자형으로 변환 Boolean() > 불린형으로 변환 형 변환이 필요한 이유 String + String = String Number + Number = Number String + Number = String 이런 경우 의도치 않은 동작이 발생합니다. 수학, 과학 점수를 입력받아 평균을 내는 프로그램을 만들어보겠습니다. const mathScore = prompt("수학 점수는?"); // 80 const engScore = prompt("영어 점수는?"); // 60 const result = (mathScore + engScore) / 2; console.log(result); // 4030 이렇게 값을 입력하면 전..

JavaScript 2022.01.02

19. [JavaScript] alert, prompt, confirm

대화 상자 alert 알려줌 alert은 메시지를 보여줍니다. 확인 버튼을 누르면 닫힙니다. 사용자와 사용 작용하기보다 프로그램에서 일방적으로 알림을 표시할 때 사용합니다. alert("hello world"); prompt 입력 받음 사용자에게 어떤 메시지를 보여주고 어떤 값을 입력받는 필드 값을 제공합니다. const name = prompt("이름을 입력하세요."); alert("환영합니다, " + name + "님"); 백 틱(``) 방식 const name = prompt("이름을 입력하세요."); alert(`안녕하세요. ${name}님. 환영합니다.`); prompt에서 아무것도 입력하지 않고 확인을 누르면 빈 값("") 리턴, 취소를 누르면 null을 리턴합니다. const name = p..

JavaScript 2022.01.02

01. [it 서적] 생활코딩! HTML + CSS + 자바스크립트

생활코딩이라는 사이트에서 한 번씩 강의도 듣곤 하는데 도서관에서 우연히 발견했을 때는 어떤 책인지 신경 쓰여서 빌리게 되었습니다. 모르는 내용보다는 아는 내용이 많은 기초적인 부분을 설명해주는 책인데 인터넷이란 무엇인가 왜 코딩이 해야 하는가 하는 개론적이 부분이 특히 마음에 들었습니다. 그리고 코딩을 해야 하는 예시도 너무 좋았습니다. 1억 개의 코드를 1초에 하나씩 수정하는데 115일이나 걸리다니 생각조차 해본 적 없는데 이런 예시가 확확 마음에 와닿았던 거 같습니다. 혹시 다른 사람에게 프로그래밍을 알려주게 된다면 egoing 같은 강사가 되고 싶다고 생각했습니다. Github : https://github.com/jun0925/opentutorials-html-css-js GitHub - jun0..

it 서적 2021.11.03

13. [JavaScript] 파일 업로드 용량 체크하기

업로드 파일 용량 체크하기 * 원하는 기능 - 자바스크립트로 파일을 업로드 하기전에 용량 체크한다. - 2MB 이하의 파일만 허용한다. - 용량 제한에 걸리면 선택한 파일은 무시한다. 아래에서 파일을 직접 선택해 보세요. 2MB 이상인 파일일 경우 경고창이 뜹니다. HTML JavaScript function checkFile(el){ // files 로 해당 파일 정보 얻기. var file = el.files; // file[0].size 는 파일 용량 정보입니다. if(file[0].size > 1024 * 1024 * 2){ // 용량 초과시 경고후 해당 파일의 용량도 보여줌 alert('2MB 이하 파일만 등록할 수 있습니다.\n\n' + '현재파일 용량 : ' + (Math.round(file..

JavaScript 2021.08.10

02. [Ajax] Ajax로 return false 처리하기

JavaCcript로 유효성 검사를 추가하던 중에 ajax에서 돌아온 데이터에 값이 false경우 retrun false로 처리해 동작을 중단하고 싶었는데 동작이 중단되지 않고 다음 유효성 검사로 넘어가서 중단하는 방법을 찾아보았다. 처음에 작성한 코드 function checkIdx(idx){ $.ajax({ method:'post', data : {idx: idx}, async:false, success : function(data) { if(data.status === false){ return false; } } }); } 수정한 코드 1 함수 내에서 ajax로 false를 리턴 하고 싶은 값이 하나면 아래 코드를 추천한다. function checkIdx(idx){ // 리턴 할 변수 추가 le..

Ajax 2021.07.29

10. [JavaScript] <script>와 <script type="text/javascript">의 차이

자바스크립트 사용할 때 어떤게 표준일까? 1. 예전에는 javascript외의 스크립트언어들이 자주 사용되었다. 그래서 브라우저가 javascript를 인식하게 하기위해 적어주었다. 2. Text를 통해서 스크립트를 구현하겠다는 뜻. HTML5에서는 의 type 디폴트가 text/javascript로 지정이 되기 때문에 선언을 해줄 필요가 없으며, 동일한 문장이라고 봐도 무방하다. 유사하게 의 디폴트도 css로 지정이 되기 때문에 type="text/css" 를 지정해줄 필요가 없다. 결론 1. 웹 표준은 가 맞지만 2. HTML5에서는 디폴트로 javascript를 지정해주기 때문에 안적어도 된다 -> 하위 호환성을 위해서는 적어주는게 좋다.

JavaScript 2021.07.16

01. [jQuery] jQuery CDN 이용하기

jQuery와 CDN 설명 jQuery는 자바스크립트의 라이브러리로, 짧은 코드를 이용해서 효율적으로 자바스크립트 코드를 작성할 수 있도록 해줍니다. jQuery를 이용하는 방법에는 아래 사이트에서 라이브러리를 다운받아서 사용하는 방법과 CDN을 이용하는 방법이 있습니다. https://jquery.com jQuery What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that ..

jQuery 2021.07.15