본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


자바스크립트22

웹 프로그래머(웹 개발자)가 되어보자 - 6 3-4. 변수 앞 시간에서 우리는 변수와 상수에 대해 살펴 보았습니다. 변수는 변하는 값을 의미하며 대입연산자(=)를 통해서 값을 대입 할 수 있습니다. 상수는 변하지 않는 값을 의미하며 대입연산자(=)를 통해서 최초 1회만 선언 할 수 있습니다. 변수는 최초 선언시에 var를 붙여 주어야하며, 이후에 값을 변경하고자 할 때는 var를 생략 합니다. 위 내용이 3-1부터 3-3까지 배운 내용의 핵심 입니다. 변수에 대한 개념을 반드시 정리하고 다음단계로 넘어가야 합니다. 4-1. 데이터(자료) 이번 시간부터는 데이터에 대해서 살펴보겠습니다. 이미 우리는 숫자는 숫자끼리 연산(덧셈, 곱셈, 나눗셈 등)이 가능하다는 것을 알 수 있었으며, 문자는 더하기 연산자(+)를 통해서 문자를 붙일 수 있다는 것을 알고.. 2020. 4. 9.
웹 프로그래머(웹 개발자)가 되어보자 - 3 3장. 자바스크립트 기초 자바스크립트는 웹 브라우저에서 동작하는 개발언어입니다. 웹브라우저는 우리가 잘 알고 있는 인터넷 익스플로러, 엣지, 네이버 웨일 및 구글 크롬등이 있습니다. 이러한 브라우저에서의 각종 기능을 사용할 수 있게 만들어진 개발언어입니다. 자바스크립트를 익혀보기 위해서 첫시간에 설치한 파이어폭스 브라우저를 실행하여봅니다. 그리고 키보드 자판기의 F12키를 눌러 개발도구탭을 선택합니다. 자, 이제 시작합니다! 3-1. 변수 변수는 어떤 정해지지 않는 임의의 값을 표현하기 위해 사용된 "기호" 입니다. 또한 변하는 값을 의미하기도 합니다. 아래 내용을 콘솔에 입력하여 봅니다. 대문자와 소문자 그리고 띄어쓰기에 주의하여주세요. var number = 1234; console.log(numbe.. 2020. 3. 31.
웹 프로그래머(웹 개발자)가 되어보자 - 2 2장. 멋진 계산기, 컴퓨터 1장에서 우리는 프로그래밍이 무엇인지에 대해서 간단하게 살펴 보았습니다. 파이어폭스라는 웹 브라우저를 실행하여 F12키를 눌러 컴퓨터가 이해할 수 있는 confirm(해석 : 확인하다) 이라는 명령어를 입력 하였습니다. 컴퓨터는 해당 명령어를 해석하여 질의문이 생성되는 창을 만들었습니다. 그렇다면, 컴퓨터는 영어를 엄청 잘 하는 것 일까요? 사실 컴퓨터는 알파벳이 무엇인지 전혀 모릅니다. 컴퓨터가 이해할 수 있는 언어는 0, 1 이라는 두가지 숫자입니다. 0은 전기가 나갔다의 의미이며, 1은 전기가 들어왔다라는 의미라고 간단하게 생각하면 됩니다. 전기가 들어왔다와 나갔다에 대해서 규칙을 만들고 해당 규칙에 대해서 행동을 하도록 사람이 프로그래밍을 한 것이 현재의 컴퓨터의 모습.. 2020. 3. 31.
Html Canvas (Html 캔버스) 튜토리얼 (차트만들기!) - 19 : 원 차트 2 이번시간에는 원형 차트에 대한 이벤트에 대해서 살펴보도록 하겠다. 기존에 보았던 이벤트보다도 난이도가 조금 높다고 생각한다. 먼저 원형 이벤트에대해서 고려해야될 점이 2가지로 구분되어진다. 1. 원 반지름 내부에 들어왔는가? 2. 부채꼴 데이터가 이루고있는 각(degree) 범위에 존재하는가? 먼저 1번에 대한 해답은 예전시간에 피타고라스의 정리를 통해서 구하는 방법으로 해결하였었다. * 기억이 안나면 : https://lts0606.tistory.com/285 그러면 이제 2번에 대해서 해결방법을 찾아야한다. 아래사진을 보자. 사용자가 1번영역을 클릭하였다고하자. 피타고라스의 정리 계산을 통해서 우리는 원 내부에 마우스가 들어왔는지 여부를 판별 할 수 있다. 그런데..반지름까지는 판별했는데 1번인지 2.. 2020. 2. 21.
Excel파일 웹에서 Table로 표현 xlsx파일을 읽어서 웹에서 표출하는 방법은 Sheetjs라는 라이브러리를 사용하면 편리하게 구현 가능 하다. 위 예제코드는 input type file에서의 예제코드이다. ajax로 바꾸는것도 어렵지는 않다. workbook에 메타데이터를 활용하면 여러 형태로 가공이 편리하다. 2019. 6. 18.
ES6 문법을 HTML에 활용해보기 export class userClass { constructor() { //생성자를 통해 내부 변수를 만들 수 있다. } accessToServer(server_url, param) { return new Promise((resolve, reject) => { //Promise 객체를 통해 ajax 통신 후 이벤트를 받로독 한다. $.ajax({ url: server_url, //보낼주소 type: 'post', data: param, //보낼 데이터 success: function (result) { resolve(result); //성공시 행위 }, error: function (errors) { reject(errors); //실패시 행위 } }); }); } } 자바스크립트 버전이 ES6이 등장.. 2019. 4. 27.