출처 생활코딩
-객체
배열과의 차이점
배열은 인덱싱을 숫자로만 가능하지만 객체는 문자로 인덱싱이 가능하다.
다른 언어에서는 연관 배열(associative array) 또는 맵(map), 딕셔너리(Dictionary)라는 데이터 타입이 객체에 해당한다.
-객체를 만드는 방법과 객체에서 값 가져오기
var grades = {'Apple': 10, 'Bat': 5, 'Cite': 68}; //Apple은 key, 10은 value
//또 다른 방법
var grades = ();
grades['Apple'] = 10;
grades['Bat'] = 5;
grades['Cite'] = 68;
//객체에서 필요한 값 가져오기
var grades = {'Apple': 10, 'Bat': 5, 'Cite': 68};
alert(grades['Cite']); //68
alert(grades.Cite); //68
-객체에 저장된 데이터를 기준으로 반복작업하기
var grades = {'Apple': 10, 'Bat': 5, 'Cite': 68};
for (key in grades) {
document.write("key: "+key+" value : "+grades[key]+"<br />");
}
//key : Apple value : 10
//key: Bat value : 5
//key : Cite value : 68
-객체를 리스트 형태로 나타내기 _html에서 script태그 바깥에 ul태그 넣어야함
<ul>
<script type="text/javascript">
var grades = {'Apple': 10, 'Bat': 5, 'Cite': 68};
for(var name in grades) {
document.write("<li>key : "+name+" value : "+grades[name]+"</li>"); //배열에서도 가능
}
</script>
</ul>
-객체 안에는 함수도 담을 수 있다.
//페이지에 표시
var grades = {
'list': {'Apple': 10, 'Bat': 5, 'Cite': 68},
'show' : function(){
for(var name in this.list){
document.write(name+':'+this.list[name]+"<br />");
}
}
};
grades.show();//콘솔로그 내에서 표시
var grades = {
'list': {'Apple': 10, 'Bat': 5, 'Cite': 68},
'show' : function(){
for(var name in this.list){
console.log(name, this.list[name]);
}
}
};객체지향 프로그래밍 _하나의 객체 안에 서로 연관된 데이터 값과 함수를 그룹핑한 것
로직을 객체에 그룹핑해서 객체라는 부품을 조립하여 소프트웨어라는 완제품을 만들 수 있게 해준다.
-모듈 _순수한 자바스크립트에서는 모듈이란 개념이 분명하게 존재하지 않으나 자바스크립트가 구동되는 호스트 환경에 따라서 서로 다른 모듈화 방법이 제공되고 있음. 자바스크립트의 대표적인 호스트 환경인 웹브라우저에서 로직을 모듈화 하는 방법에 대해 알아볼 것
-호스트 환경 _자바스크립트가 구동되는 환경 node.js, Google Apps Script ...
-모듈의 사용
//greeting.js
function welcome(){
return 'Hello world';
}//main.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script src="greeting.js"></script>
</head>
<body>
<script>
alert(welcome());
</script>
</body>
</html>script태그 내의 컨텐츠 대신 src가 src 속성의 파일을 실행시킴
-호스트환경에 따라 모듈을 로드하는 방법이 다르다 예시) node.js
모듈이 프로그램을 구성하는 작은 부품으로서의 로직을 의미한다면
-라이브러리는 자주 사용되는 로직을 재사용하기 편리하도록 잘 정리한 일련의 코드들의 집합
라이브러리는 중요하다! 코드를 효율적이게 만들어줌
-유명 라이브러리인 jQuery 사용하는 방법
-API(Application Programming Interface) _프로그램이 동작하는 환경을 제어하기 위해 환경에서 제공되는 조작장치. 프로그래밍 언어를 통해 조작 가능.
UI(User Interface) _사용자가 제어하는 시스템, 사용자와 사물(기계, 시스템, 프로그램) 사이에서 의사소통이 가능하도록 일시적, 영구적인 접근을 목적으로 만들어진 물리적, 가상적 매개체 _from wikipedia
-자바스크립트의 api
1. 자바스크립트 자체의 api _문서
ECMA-262 - Ecma International (ecma-international.org)
표준안 자바스크립트를 사용하는 개발자보다는 자바스크립트가 동작하는 시스템을 개발자들을 위한 것
JavaScript 사전 - 생활코딩 (opentutorials.org)
JavaScript reference - JavaScript | MDN (mozilla.org)
2. 자바스크립트가 동작하는 호스트 환경의 api
Index | Node.js v17.3.1 Documentation (nodejs.org)
Apps Script | Google Developers
-정규표현식 regular expression _일종의 언어
정규표현식을 자바스크립트에서 사용하는 방법을 알아볼 것
반복되는 작업을 간편하게 해줌
js 수업이 끝나면 돌아오기
'Programming > Javascript' 카테고리의 다른 글
| 자바스크립트 객체 지향 (0) | 2022.02.11 |
|---|---|
| 자바스크립트 콜백, 비동기처리. 비동기 콜백 (0) | 2022.02.06 |
| 생활코딩 자바스크립트 함수 (0) | 2022.01.16 |
| 생활코딩 자바스크립트 반복문까지 (0) | 2022.01.14 |
| js부터 공부 (0) | 2021.12.30 |
댓글