자바스크립트46 node.js/자바스크립트 - 13. 조건문 if 2형식 페이지 누락 문제로 책이 반려되어 ㅎ.. 수정 후 부크크 출판사에 다시 심사를 넣었습니다. 오늘도 책자 내용중 페이지 일부 올려봅니다. 조건문 2형식 : if(조건식){ … } else {…} 컴퓨터가 조건식에 따라 참, 거짓을 판단해서 참인 경우 첫째 코드블록 {…}, 거짓일 경우 else에 있는 두번째 코드블록 {…}을 실행합니다. 예시) pm2_5=35; if(pm2_5>=35){ console.log("집콕"); } else { console.log("외출"); } if 조건문은 else 와 동반해서 사용할 수 있는데요. else 란 ‘이미 언급된 것과 다른’ 이란 뜻을 가지고 있습니다. 아래 코드는 조건식1이 참일 경우 코드블록1을 실행하고, 그렇지 않다면 코드블록2를 실행합니다. if(조건식1.. 2022. 2. 7. node.js / 자바스크립트 - 조건문 if 1형식 본문은 책자에 들어가는 내용 중 일부입니다. 책자를 마무리해서 우선 심사를 넣었는데 한번에 통과하면 좋겠군요 ㅎ 조건문 1형식 : if(조건식){ … } 컴퓨터가 조건식에 따라 참, 거짓을 판단해서 참인 경우 코드블록 {…}을 실행합니다. 예시) chocolet=10; if(chocolet>=8){ console.log("초콜렛이 8개 이상!"); } 초콜렛이 10개가 있다고 칩시다. 철수는 초콜렛이 8개 이상이면 1개를 먹기로 결정했는데요. 철수가 초콜렛을 먹으려면 초콜렛이 8개 이상인가?라고 판단을 해야 한다고 칩시다. 이렇게 특정 조건에 따라 판단하여 처리하는 기능을 조건문이라고 하는데요. 조건을 판단하기 위해 참(true), 거짓(false)을 판단하는 분명한 기준을 제시해야 합니다. (조건식)에.. 2022. 2. 6. node.js / 자바스크립트 - 형변환 ( TYPE CASTING ) 10장이 너무 글이 적은것 같아서 ㅎ.. 하나 더 올립니다. 앞에서 다룬 변수에는 숫자형과 문자형이 있는데요. 만일 숫자형과 문자형을 혼합해 사용하려면 어떻게 해야 할까요? 이를 테면 숫자변수 count에는 10이란 값이 들어 있고 visit=1000000; 아래와 같은 문구를 출력하려고 합니다. "100000만번째 방문하셨습니다." 자바스크립트에서는 고민할 필요가 없습니다. 그냥 아래와 같이 써주면 되거든요. console.log(visit + "번째 방문하셨습니다"); 그러면 숫자였던 visit 는 자동으로 문자열로 바뀌어 문자열 이어 붙이기가 작동합니다. 이렇게 변수의 형태가 바뀌는 것을 타입 캐스팅(Type Casting)이라고 하는데요. 반드시 숫자와 문자끼리 연산이 되어야만 문자열로 바뀝니다... 2022. 1. 27. node.js/자바스크립트 - 문자열 연산 문자열 연산 + “감”과 “자”를 더하면 무엇이 될까요? “감자”가 됩니다. 예시) str="감"+"자"; // “감자” 문자열 연산은 오로지 덧셈 + 밖에 없습니다. 문자열 연산에서의 덧셈기호는 2개의 문자열을 이어서 붙인다는 특성이 있는데요. 덧셈 기호 좌변과 우변의 변수 또는 문자열을 그대로 붙여 줍니다. 아래 코드를 실행할 경우, str1 의 ‘튀김과’ 와 str2의 ‘오뎅’을 붙여 ‘튀김과오뎅’이 됩니다. str1='튀김과'; str2='오뎅'; str3=str1+str2; // 결과 : ‘튀김과오뎅’ 아래와 같이 변수와 문자열을 섞어서 연속해 이어붙일 수도 있습니다. count="1"; str="총 갯수는 " + count + "개입니다."; // 결과 : ‘총 갯수는 1개입니다.’ 문자열 대.. 2022. 1. 27. node.js / 자바스크립트 - 연산순위 연산자 우선순위 1+2*3은 얼마일까요? 곱셈이 먼저 계산됩니다. 예시) q=1+2*3; // 7 1 + 2 * 3 은 덧셈과 곱셈중 2 * 3이 먼저 계산되기 때문에 1+2 * 3 → 1 + 6 → 7 입니다. 이처럼 연산식을 차례대로 나열하는 경우, 연산이 먼저 진행되는 순서가 있는데요. 산술연산만 다뤄보겠습니다. 자바스크립트와 다른 컴퓨터언어는 연산자 우선순위가 다르니 다른 컴퓨터언어는 해당 언어 연산식 우선순위를 참조해 주시기 바랍니다. 여기서 순위는 Mozila 공식 사이트와 상이합니다. 해당 정보는 아래 URL을 참조해 주세요. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Operator_Precedence .. 2022. 1. 23. node.js - 값의 종류와 변수 대입 준비중인 node.js 책자의 일부입니다. 이번 챕터는 쉬운 부분과 어려운 부분이 섞여 있습니다. 학습을 다짐하신 분께는 이해 가능한 부분은 이해하려 노력하시되 어려운 부분은 어느 정도 개념이 쌓여야 되므로 당장 이해가 안되도 추후 필요한 시점에 다시 들여다 보실 것을 권합니다. 방문을 위해 가볍게 오신 분들은 전혀 부담 갖지 마세요 :) 이제 개발자 도구로 자바스크립트를 테스트하는 부분은 충분히 설명드렸으니, 이 후로는 설명을 보고 한번씩 시도해 보시길 바랍니다. 그냥 눈으로 읽으신 것과 직접 타이핑해서 시도해보신 것은 차이가 매우 큽니다. 앞에서 다룬 변수에는 어떤 값을 대입할 수 있을까요? 대표적인 것이 숫자, 문자열, 논리값, 오브젝트, 그리고 배열입니다. 함수를 대입할 수도 있긴 한데 이건 함수.. 2022. 1. 19. node.js - 여러줄의 코드 입력과 코드 히스토리 자, 다시 실습입니다. 앞의 게시글에서 보셨던 것처럼 여러줄의 연속된 코드라도 개발자 도구에서 테스트 가능합니다. 다만 여러줄을 입력시에는 enter 키 대신 shift+enter 키를 입력해주시면 됩니다. 개발자도구 콘솔에서 let a=1; 입력 후, Enter 키 대신 Shift+Enter 키를 입력해 주세요. (shift 키를 누른 채로 놓지 말고 Enter 키를 누르는 것을 의미합니다 ) 그러면 깜박이는 커서가 아랫줄로 내려가는데요. 아직 이 코드는 실행되지 않은 상태입니다. 그 상태에서 중괄호 기호 { 입력 후 shift + Enter let a=2; 입력 후 shift + Enter 중괄호 기호 닫고 } shift + Enter 마지막으로 console.log(a); Enter 를 입력해주시면.. 2022. 1. 17. node.js - 04.변수선언 - 실습 이제 개발자 도구를 가지고 몇가지 실습을 해볼텐데요. 바로 바로 결과를 보도록 하겠습니다. F12 키를 눌러 개발자 도구 창을 띄우고 1) 콘솔 탭을 선택, 2) 그리고 그 아래 커서가 깜박이는 입력란을 클릭하세요. 다음으로 아래 내용을 타이핑하시면 됩니다. ( 숫자 8은 안 들어가요! ) let A=12345679; 콘솔창에는 이와 같이 알록달록한 텍스트가 표시될겁니다. 모두 입력하신 다음 Enter 키를 눌러 주세요. 콘솔창에서 Enter 키는 입력한 명령을 실행해!라는 의미입니다. undefined 라고 표시될텐데요 신경쓰지 않으셔도 됩니다. 이제 변수A라는 상자에 12345679 라는 값이 입력되었습니다. 정말로 그런가 확인해볼까요? console.log 라는 명령어로 확인할 수가 있는데요. 아래.. 2022. 1. 12. node.js - 02. 비장의 기술 개발자 도구! 준비중인 Node.js 책자 일부입니다. node.js 는 자바스크립트로 작동하는 언어라 자바스크립트를 잘 알면 이해가 수월한데요. 자바스크립트를 연습하기 위한 준비물이 그리 거창하지 않습니다. 2가지 방법이 있습니다. 첫째는 크롬 웹브라우저 개발자 도구에서 테스트하는 방법(엣지브라우저도 가능) 둘째는 AWS 서버 터미널 창에서 테스트하는 방법 크롬 웹브라우저에서 테스트하는 방법이 더 이점이 있습니다. 변수값을 직접 보면서 테스트하는 기능이 있거든요. 필자는 크롬브라우저가 더 친숙하기 때문에 크롬브라우저로 진행하겠습니다. 크롬브라우저를 여신 다음 F12키를 눌러 보세요. 그러면 무슨 창이 뜰텐데요. 이걸 개발자 도구라고 부릅니다. 처음에 이 창은 브라우저 하단에 붙어서 나오는데요. 자바스크립트 연습을 위.. 2022. 1. 10. node.js express | 템플릿쪽지함 #8. 기다려! await! 지난 스토리에서는 mysql2 모듈을 사용할 때 프로미스에 대해서 알아보았는데요. https://itadventure.tistory.com/444 node.js express | #7. mysql2 프로미스 지난 스토리에서 다루었던 쪽지 템플릿에는 MYSQL 이라는 저장하는 부분을 비롯하여 클래스라는 부분까지 여러 요소가 추가되었는데요. node.js의 프로미스라는 특징적 부분까지 다루어야 해서 예 itadventure.tistory.com 프로미스란 일종의 약속 덩어리이기 때문에 콜백(callback) 라는 프로그래밍 개념과는 다른 의미이며 mysql 에서는 보통 아래와 같이 사용된다고 살펴보았습니다. db.query( "SELECT x, y, r, memo FROM memolist" ).then((r.. 2021. 9. 26. 캔버스와 함께하는 자바스크립트, 13번째 시간 - 3D세계의 창조 1. HTML 표준 CANVAS 기술 소개 / https://itadventure.tistory.com/130 2. 자바스크립트와 CANVAS 두번째시간. 캔바스에 눈을 내리자 / https://itadventure.tistory.com/131 3. 자바스크립트와 캔버스 3번째 시간, 공튀기기 놀이 / https://itadventure.tistory.com/132 4. 자바스크립트와 캔버스 4번째 시간, 마우스의 파동을 느껴봐! | https://itadventure.tistory.com/133 5. 자바스크립트와 캔버스, 테트리스를 만들어봐-1 | https://itadventure.tistory.com/136 6. 자바스크립트와 캔버스, 테트리스를 만들어봐-2 | https://itadventure.. 2019. 10. 2. 자바스크립트와 캔버스 12, 테트리스를 만들어봐-Final 1. HTML 표준 CANVAS 기술 소개 / https://itadventure.tistory.com/130 2. 자바스크립트와 CANVAS 두번째시간. 캔바스에 눈을 내리자 / https://itadventure.tistory.com/131 3. 자바스크립트와 캔버스 3번째 시간, 공튀기기 놀이 / https://itadventure.tistory.com/132 4. 자바스크립트와 캔버스 4번째 시간, 마우스의 파동을 느껴봐! | https://itadventure.tistory.com/133 5. 자바스크립트와 캔버스, 테트리스를 만들어봐-1 | https://itadventure.tistory.com/136 6. 자바스크립트와 캔버스, 테트리스를 만들어봐-2 | https://itadventure.. 2019. 10. 2. 이전 1 2 3 4 다음
