강좌 : 유튜브 생활코딩
3. WEB2-JavaScript
✍객체
객체에 속해있는 함수는 함수라 하지 않고 메소드(method)라고 부른다
객체 만들기
var coworkers = {
"prigrammer":"egoing",
"designer":"leezche"
};객체에 정보추가
coworkers.bookkeeper = "duru";
coworkers["data scienist"] = "teaho";++ 이름에는 공백을 사용할 수 없어 점 대신 대괄호를 사용
객체 불러오기
document.write("programmer : "+coworkers.programmer);
// 결과 → programmer : egoing객체에 있는 모든데이터 불러오기
<script>
for(var key in coworkers) {
document.write(key+' : '+coworkers[key]+'<br>');
}
</script>Property & Method
- 객체에 소속된
함수 : 메소드/ 객체에 소속된변수 : 프로퍼티 - 객체에 소속된 변수의 값으로 함수를 지정할 수 있고 객체에 소속된 함수를 만들 수 있다
- 객체의 프로퍼티와 프로퍼티를 구분할때 콤마(,)를 찍는다
coworkers.showAll = function(){
for(var key in this) {
document.write(key+' : '+this[key]+'<br>');
}
}
coworkers.showAll();함수정의방법(셋다 같은방법)
coworkers.showAll = function(){
}
function showAll(){
}
var showAll = function(){
}var body = {
setColor : function(color){
document.querySelector('body').style.color = color;
}
}완성
<script>
var Links = {
setColor : function(color){
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = color;
i = i + 1;
}
}
}
var Body = {
setColor : function(color){
document.querySelector('body').style.color = color;
},
setBackgroundColor : function(color){
document.querySelector('body').style.backgroundColor = color;
}
}
function nightDayHander(self){
var target = document.querySelector('body');
if(self.value ==='night'){
Body.setBackgroundColor ('black');
Body.setColor ('white');
self.value = 'day';
Links.setColor('powderblue');
} else {
Body.setBackgroundColor('white');
Body.setColor('black');
self.value = 'night';
Links.setColor('blue');
}
}
</script>
<body>
<h1><a href="index.html">WEB</a></h1>
<input id="night_day" type ="button" value="night" onclick="
nightDayHander(this);
">
</body>✍라이브러리와 프레임워크
라이브러리
jQuery- 소프트웨어를 만드는 내가 라이브러리를 당겨와서 쓰는 느낌
- 만들고자 하는 프로그램에 필요한 부품이 되는 소프트웨어를 잘 정리정돈 해놓아 재사용하기 쉽도록 되어 있다
프레임워크
- 프레임워크 안에 들어가서 작업하는 느낌
- 만들고자 하는 것의 언제나 필요한 공통적인 부분을 프레님워크가 만들어놔서 달라지는 부분만 살짝살짝 수정하면 된다
✍UI & API
UI(User Interface)
- 사용자가 시스템을 제어하기 위해서 사용하는 조작장치들을 부른다
API(Application Programming Interface)
- 애플리케이션을 만들기 위해서 프로그래밍을 할 때 사용하는 조작장치들을 부른다
코린이