본문 바로가기

전체 글

(341)
[세번째] JavaScript - Web Browser / DOM Document Of ModelDOM (1) 제어대상을 찾기document : 문서 전체를 의미하는 객체 1. document.getElementsByTagName 메소드 사용유사배열을 가져온다. var lis = document.getElementsByTagName('li');for(var i=0; i ul객체를 찾으면 된다.(document로 하는게 아닌) 2. class 적용하여 개체찾기document.getElementsByClassName인자로 전달된 값에 해당하는 클래스에 속해있는 개체를 찾아서 유사배열에 담는다. 3.ID적용하여 개체찾기 var li = document.getElementById..
[두번째] JavaScript - Web Browser / BOM Browser Object Model of Javascript BOM 1. 사용자와 커뮤니케이션1) alert경고창을 띄운다.alert가 실행되고 있으면 다음 로직이 실행되지 않는다.이건 confirm 이나 prompt도 마찬가지이다.Debugging 용도로 많이 사용됬지만 요즘엔 개발자 도구의 발전으로 주로 console.log를 사용하여 Debugging한다. 2) confirm예/아니오 를 묻는 대화상자를 띄운다.예 일 경우에는 true를 return.아니오 일 경우엔 false를 return. if(confirm('ok?')){ alert('ok'); } else { alert('cancel'); }이렇게 사용한다.로직의 흐름을 분기시키는 역할. 3) prompt대화상자 안에 텍스트 상자를 생성...
[첫번째] JavaScript - Web Browser / 기본 웹브라우저 상에서의 자바스크립트 Javscript를 로드하기html은 html끼리JS는 JS끼리 모여있는게 유지보수하기 편하다. html 은 정보에 집중JS 는 제어에 집중 1) inline 방식한줄에 HTML 태그와 Javascript 언어를 모두 작성한다.정보와 제어방식이 함께 있어서 유지보수가 불편하다. 2) 로 끼어두기하지만 여기서도 html문서내에 JS 구문이 남아있기에 불편 3) 외부 파일 로드 방식(src 속성 이용) +) script 태그의 위치 :head 태그에 위치Uncaught TypeError: Cannot read property 'addEventListner' of nulljs태그를 발견을 하면 외부에 있는 js파일을 다운로드를 받은 다음에 나머지 내용을 실행한다.그말은var h..
[네번째] JavaScript - Basic / 객체 지향 언어 객체 지향 언어로서의 자바스크립트객체지향생성자와 newthis상속prototype표준 내장 객체의 확장배열의 확장Object데이터 타입 0. 객체지향객체란 서로 연관된 변수와 함수를 그룹핑한 container 이다.객체 내 변수를 프로퍼티/객체 내 함수를 메소드/ 라고 부른다.객체 지향의 핵심은 객체라는 단단한 테두리 안에 서로 연관된 메소드와 변수를 모아서정리하는 것이다. 1. 생성자와 new생성자는 객체를 만드는 역할의 함수다.자바스크립트에서 함수는 재사용 가능한 로직의 묶음이 아니라 객체를 만드는 창조자라고 할 수 있다.함수를 호출할 때 new를 붙이면 새로운 객체를 만든 후에 이를 리턴한다. 일반적인 객체지향 언어에서 생성자는 클래스의 소속이다.하지만 자바스크립트에서 객체를 만드는 주체는 함수다...
[세번째] JavaScript - Basic / 함수형 프로그래밍 언어 함수형 프로그래밍 언어로서의 JavaScript유효범위콜백클로저arguments호출 유효범위var를 함수 안에서 사용하면 지역변수가 되고함수 밖에서 사용하면 전역변수가 된다.전역변수는 왠만해서는 쓰지 않는 것이 원칙이다.자신이 변수로 지정한 것이 나중에 다른 용도로 쓰일 수도 있기 때문에 전역에다가 변수를 지정해두는 것은추후 작업에 막대한 영향을 끼치게 되는 것이다. 자바스크립트에서는 함수 안에서만 선언된 var 변수가 지역변수가 된다.다른 언어에서는 for , if 등의 구문 안에서 선언된 var 변수도 지역변수가 된다. 콜백.메소드란 객체의 속성 값으로 담겨진 함수를 의미한다.함수는 값이기 때문에 다른 함수의 인자로 전달 될수도 있다.그리고 함수의 리턴값으로 함수를 사용할 수 있다.당연히 배열의 값으..
[두번째] JavaScript - Basic / 스크립트 언어 자바스크립트 두번째.스크립트 언어로서의 자바스크립트모듈정규표현식 객체객체와 배열의 차이배열은 아이템에 대한 식별자로 숫자를 사용했다.데이터가 추가되면 배열 전체에서 중복되지 않는 인덱스가 자동으로 만들어져서추가도니 데이터에 대한 식별자가 된다.이 인덱스를 이용해서 데이터를 가져오게 되는 것이다.그런데 만약 인덱스로 문자를 사용하고 싶다면 객체를 사용해야 한다.다른 언어에서는 객체를 연관배열 or맵or딕셔너리라는 데이터 타입이 객체에 해당한다. making method 1.var grades = {'a':1,'b':2,'c':3};var로 선언하고 grades라는 객체명을 입력하고 {}로 묶어준다.a,b,c는 key가 되고 1,2,3은 value값을 의미하게 된다. making method 2.var gr..
[첫번째] JavaScript - Basic / 기본적인 핵심 문법 C언어로 기초적인 문법사항들에 대해 숙지가 된 상태라강의 들으면서 필기한 내용을 대충 정리해서 올렸다.프롤로그 편에서 다룰 문제들이다. -기본적인 핵심 문법(거의 모든 프로그래밍 언어들이 비슷한 문법구조로 이루어 지는 부분들)숫자와 문자변수주석줄바꿈과 여백비교조건문반복문함수배열--- 자바스크립트(이하 JS) 생활코딩 수업내용// Math. 을 이용하면 보다 복잡한 수학 계산도 가능하다.(Math 메소드라고 한다.)JS에서는 큰따옴표나 작은따옴표가 붙지 않는 숫자는 숫자로 인식. 숫자와는 반대로 문자의 경우에는 큰따옴표 혹은 작은 따옴표로 감싸야 한다.큰 따옴표로 시작했으면 큰 따옴표로 끝나야하고작은 따옴표로 시작했으면 작은 따옴표로 끝나야 한다. typeof -> string / number줄바꿈은 C와..
[개발상식] 2. 프레임워크와 라이브러리 결론부터 말하자면프레임워크와 라이브러리의 차이는코드가 수동적으로 사용되냐, 능동적으로 사용하냐의차이를 갖고 있다. 프레임 워크(Web Application Framework)란"프로그래밍에서 특정 운영 체제를 위한 응용프로그램 표준 구조를 구현하는 클래스와 라이브러리 모임이다." 라고위키에서는 정의한다. 라이브러리란"소프트웨어를 만들 때 쓰이는 클래스나 서브루틴들의 모임을 가리키는 말이다."라고위키에서는 정의한다. 역시 단순한 정의로는 와닿지 않는다. https://kldp.org/node/124237재미있는 글이 올라와 각색했다.---*---프레임워크와 라이브러리의 차이를 알기 위해서는 물리적인 계층이 아니라 논리적인 계층을 보아야 한다.물리적인 계층을 보면일단 모든 소스코드든 라이브러리든 메모리에 들..