점미의 스터디 점미의 스터디

JavaScript

• WEB2 - JavaScript - 데이터타입 - 문자열과 숫자

  JavaScript/생활코딩 2018. 12. 18. 10:06

  데이터타입 - 문자열과 숫자 - https://opentutorials.org/course/3085/18870 데이터타입은 자료형이다.자바스크립트에는 아래와 같은 데이터타입이 있다.Number, String이라는 데이터 타입을 확인해본다. BooleanNullUndefinedNumberStringSymbol Number는 산술연산자를 사용할 수 있다.아래와 같이 +, -, *, /을 사용한다. 1+1 = 22-1 = 12*2 = 42/2 = 1 연산을 콘솔창에서 확인 할 수 있다. String은 "", '' 사이에 문자를 입력한다.toUpperCase()는 문자열을 대문자로 변경해준다.indexOf()는 해당문자가 있는 위치를 숫자로 알려준다.trim()은 공백을 없애준다. 아래는 문자열을 어떻게 사용할..

  Read More
• WEB2 - JavaScript - HTML과 JavaScript의 만남 2 (이벤트, 콘솔)

  JavaScript/생활코딩 2018. 12. 17. 13:27

  HTML과 JavaScript의 만남 2 (이벤트) - https://opentutorials.org/course/3085/18782 이벤트는 사용자와 상호작용하는데 핵심적인 역할을 한다. 이벤트는 사용자가 어떠한 행동을 취했을 때 브라우저가 그것을 캐치해서 브라우저에서 보여주는 것이다.클릭을 했을 때, 어떤 일이 일어난다.텍스트를 입력했을 때, 어떤 일이 일어난다.키보드에서 어떤 키를 눌렀을 때, 어떤 일이 일어난다.여기서 어떤 일을 자바스크립트로 제어하는 것이다 HTML과 JavaScript의 만남 3 (콘솔) - https://opentutorials.org/course/3085/18869 어떤 가벼운 코드를 실행해야 하는 경우 html파일을 만드는 것이 아닌 콘솔을 이용하여 코드를 테스트할 수 있..

  Read More
• WEB2 - JavaScript - HTML과 JavaScript의 만남 1 (script 태그)

  JavaScript/생활코딩 2018. 12. 14. 17:21

  HTML과 JavaScript의 만남 1 (script 태그) - https://opentutorials.org/course/3085/18778 HTML에 어떻게 JavaScript언어를 넣을 수 있을까?-> 이부분은 JavaScript언어로 인식된다. 왜 JavaScript를 사용하나?-> HTML과 다르게 사칙연산을 할 수 있기 때문이다. 1+11+1 빨간부분 - JavaScript코드를 실행시키면 javascript라는 문자와 숫자2가 출력된다.->숫자에 사칙연산을 시키면 그것을 계산할 수 있는 능력이 있다. 파란부분 - HTML코드를 실행시키면 1+1라는 문자와 1+1라는 문자가 출력된다.->HTML은 아무리 사칙연산을 적어도 계산되지 않고 적은 그대로의 내용만 출력할 수 있다.

  Read More
• 자바스크립트 기본 - 참조

  JavaScript/생활코딩 2018. 12. 12. 13:49

  참조 - https://opentutorials.org/course/743/6507 복제 아래결과는 1이된다. var a = 1;var b = a;b = 2;console.log(a); // 1 위의 예제를 그림으로 표현하면 아래와 같다.b는 복제된 상태이므로 b의 값, 즉 복제본을 아무리 바꿔도 원본은 바뀌지않는다는 개념이 복제이다.복제는 원시데이터타입에서 동작한다. 참조 var a = {'id':1};var b = a;b.id = 2;console.log(a.id); // 2 위의 예제를 그림으로 표현하면 아래와 같다.a는 객체이므로 복제가 이루어지지 않고 a,b가 같은 값을 바라보는 참조가 발생한다. 함수와 참조 아래는 원시데이터타입을 인자로 넘겼을 때의 동작 모습니다. Case1var a = 1;..

  Read More
• 자바스크립트 기본 - 데이터 타입

  JavaScript/생활코딩 2018. 12. 12. 11:01

  데이터 타입 - https://opentutorials.org/course/743/6579 원시 데이터 타입 데이터 타입이란 데이터의 형태를 의미한다. 데이터 타입은 크게 두가지로 구분할 수 있다. 객체와 객체가 아닌 것. 그럼 객체가 아닌 것은 무엇일까? 숫자문자열불리언(true/false)nullundefined 객체가 아닌 데이터 타입을 원시 데이터 타입(primitive type)이라고 한다. 그 외의 모든 데이터 타입들은 객체다. 래퍼객체 원시 데이터 형을 객체처럼 다룰 수 있도록 하기 위한 객체를 자바스크립트는 제공하고 있는데 그것이 레퍼객체(wrapper object)다. 아래는 문자열을 객체처럼 사용할 수 있는 예제이다.var str = 'coding';console.log(str.leng..

  Read More
• 자바스크립트 기본 - Object

  JavaScript/생활코딩 2018. 12. 12. 10:46

  Object - https://opentutorials.org/course/743/6578 Object 객체는 객체의 가장 기본적인 형태를 가지고 있는 객체이다. 다시 말해서 아무것도 상속받지 않는 순수한 객체다. 자바스크립트에서는 값을 저장하는 기본적인 단위로 Object를 사용한다. Object 객체가 가지고 있는 prototype은 모든 객체가 공통적으로 사용할 수 있다. Object의 확장을 통한 예제이다.Object.prototype.contain = function(neddle) { //contain은 사용자가 지정한 함수이다. for(var name in this){ //this는 메소드가 소속되어있는 객체를 의미한다. contain에서 소속되어있는 객체는 o이므로 o를가리키거나, conta..

  Read More
• 자바스크립트 기본 - 표준 내장 객체의 확장

  JavaScript/생활코딩 2018. 12. 7. 16:33

  표준 내장 객체의 확장 - https://opentutorials.org/course/743/6475 표준 내장 객체(Standard Built-in Object)는 자바스크립트가 기본적으로 가지고 있는 객체이다.객체들은 아래와 같다. ObjectFunctionArrayStringBooleanNumberMathDateRegExp 내장객체에 어떠한 기능을 추가하는 방법이 있다. var arr = new Array('seoul','new york','ladarkh','pusan', 'Tsukuba'); //Array에 있는 값들이 랜덤하게 나올 수 있게 해야한다.function getRandomValueFromArray(haystack){ var index = Math.floor(arr.length*Math..

  Read More
• 자바스크립트 기본 - prototype

  JavaScript/생활코딩 2018. 12. 7. 14:14

  prototype - https://opentutorials.org/course/743/6573 prototype을 통해서 자바스크립트는 상속이라는 개념을 제공하고 있다. function Ultra(){}Ultra.prototype.ultraProp = true; function Super(){}Super.prototype = new Ultra(); //Ultra가 Super의 부모가된다. function Sub(){}Sub.prototype = new Super(); //Super가 Sub의 부모가 된다. var o = new Sub();console.log(o.ultraProp); // o는 Sub객체를 담고 있는 객체인데 Sub는 Ultra에게 상속받고 있기 때문에 ultraProp라는 값을 가지고..

  Read More