[JavaScript-생활코딩] 28. 라이브러리와 프래임워크
·
STUDY/JavaScript
라이브러리와 프래임워크 - WEB2 - JavaScript (opentutorials.org) 라이브러리와 프래임워크 - WEB2 - JavaScript 라이브러리와 프래임워크 2017-12-02 16:24:54 opentutorials.org ​ 1.라이브러리(library) 2.프레임워크(framework) - 두가지는 다른 사람의 도움을 받아 소프트웨어를 만든다는 점에서 비슷하다. 1.라이브러리는 내가만들고자 하는 프로그램에 필요한 부품들이 되는 소프트웨어를 잘 정리정돈 해놓는 소프트웨어 내가만들고있는 프로그램에 사용할 부품​을 가져오는 것 같은 느낌 2.프레임워크는 만들고자 하는 것이 있을때 만들고자 하는 것이 무엇이냐에 따라서 (예 게임,채팅,웹) 언제나 필요한 공통적인 부분은 프레임워크라는 것..
[JavaScript-생활코딩] 27. 파일로 쪼개서 정리 정돈하기
·
STUDY/JavaScript
파일로 쪼개서 정리 정돈하기 - WEB2 - JavaScript (opentutorials.org) 파일로 쪼개서 정리 정돈하기 - WEB2 - JavaScript 파일로 쪼개서 정리 정돈하기 2017-11-29 10:32:18 opentutorials.org ​ 정리정돈의 도구들 : 함수,객체 함수와객체보다 더 큰 정리정돈의 도구 (가장 큰 정리정돈의 도구)이자 서로 연관된 코드들을 파일로 묶어서 그룹핑 하는 것. = 파일로 쪼개서 정리 정돈하기 이것을 사용하면 웹페이지가 아무리 많아도 많은 웹페이지들을 감당할 수 있게된다. 1.html WEB HTML CSS 2.html WEB HTML CSS 3.html WEB colors.js var Links = { setColor:function(color){..
[JavaScript-생활코딩] 26. 객체 활용
·
STUDY/JavaScript
객체 활용 - WEB2 - JavaScript (opentutorials.org) 객체 활용 - WEB2 - JavaScript 객체 활용 2017-12-02 16:21:10 opentutorials.org ​ 바디라는 변수에 객체를 담는다. var Body = { } 이 객체에 프로퍼티(객체에 소속된 변수) 로 setColor를 지정한다음에 var Body = { setColor: } 여기있는 이코드에 function을 넣어 사용 객체는 객체의 프로퍼티와 프로퍼티를 구분할때 콤마(,)를 찍는다. var Body = { setColor:function (color){ document.querySelector('body').style.color = color; }, setBackgroundColor:fun..
[JavaScript-생활코딩] 25. 객체
·
STUDY/JavaScript
객체 - WEB2 - JavaScript (opentutorials.org) 객체 - WEB2 - JavaScript 객체 2017-11-28 23:32:58 객체의 쓰기와 읽기 변경사항 객체와 반복문 변경사항 프로퍼티와 메소드 변경사항 opentutorials.org 1.객체의 쓰기와읽기 / 2.객체와반복문 / 3.프로퍼티와메소드 객체의 쓰기와 읽기 ​ 배열(array) - 정보를 담는 그릇이면서, 순서대로 정보가 저장된다. 예) var coworkers = ['egoing', 'leezche'] coworkers[0] → egoing coworkers[1] → leezche 그러면 반대로, 순서없이 정보가 저장되는 것은? : 객체 객체 - 이름이 있는 정리정돈 상자 Object Create * 배열을..
[JavaScript-생활코딩] 24. 객체예고
·
STUDY/JavaScript
https://opentutorials.org/module/3180/18884 객체예고 - WEB2 - JavaScript 소스코드 변경사항 opentutorials.org 객체 - 정리정돈의 수단 ( 쉽게 표현하자면 폴더 ) function LinksSetColor(color){ var alist = document.querySelectorAll('a'); var i = 0; while(i < alist.length){ alist[i].style.color = color; i = i + 1; } } function BodySetColor(color){ document.querySelector('body').style.color = color; } function BodySetBackgroundColor..
[JavaScript-생활코딩] 23. 함수의 활용
·
STUDY/JavaScript
https://opentutorials.org/module/3180/18883 함수의 활용 - WEB2 - JavaScript 소스코드 변경사항 opentutorials.org 리팩토링 하는데 필요한 함수 WEB HTML CSS JavaScript JavaScript JavaScript (/ˈdʒɑːvəˌskrɪpt/[6]), often abbreviated as JS, is a high-level, dynamic, weakly typed, prototype-based, multi-paradigm, and interpreted programming language. Alongside HTML and CSS, JavaScript is one of the three core technologies of Wo..
[JavaScript-생활코딩] 22. 함수
·
STUDY/JavaScript
https://opentutorials.org/module/3180/18851 함수 - WEB2 - JavaScript 함수의 기본 소스코드 변경사항 매개변수(parameter)와 인자(argument) 소스코드 변경사항 리턴 4:04초의 결과가 붉은색 5가 아닌 붉은색 23이 된 이유는 자바스크립트는 문자와 숫자를 더하면 숫자를 opentutorials.org 1.함수의기본 / 2.매개변수(parameter)와 인자(argument) / 3.리턴 1.함수의 기본 Function Basic ↓화면출력↓ ·1 ·2-1 ·2-2 ·3 ·2-1 ·2-2 ​function two ( ) { document.write('2-1'); document.write('2-2'); } ㄴ function 함수 ㄴ two ..
[JavaScript-생활코딩] 21. 함수예고
·
STUDY/JavaScript
https://opentutorials.org/module/3180/18882 함수예고 - WEB2 - JavaScript 함수예고 2017-12-02 16:00:16 opentutorials.org Function 이라는 수납공간 Function = 함수 ​ 육안으로 분간 할 수 없는 여러개의 코드를 한번에 수정할 수 있게 하는 방법
[JavaScript-생활코딩] 20. 배열과 반복문의 활용
·
STUDY/JavaScript
https://opentutorials.org/module/3180/18850 배열과 반복문의 활용 - WEB2 - JavaScript 소스코드 변경사항 opentutorials.org 콘솔창은 계산기처럼 사용이 가능하다. *콘솔창 줄바꿈 : shift + enter ​ document.querySelector : CSS셀렉터 document.querySelector('a'); ↑ a를 첫번째로 나오는 1개만 가져온다. ​ ​ (여러개를 가져와야 하니까) JavaScript get element by css selector multiple 로 검색! document.querySelectorALL('a'); ↑ 배열을 가져온다 ​ var alist = document.querySelectorAll('a')..