[Javascript] 8장. 웹 문서를 다루는 방법, 문서 객체 모델 (DOM) (3)
2022. 11. 30. 18:38
스스로 공부하기/Javascript
08-3. 웹 요소의 태그 속성 가져와서 수정하기 지금부터는 접근한 웹 요소의 속성 노드에 접근하는 법을 알아볼 것이다. 선택한 상품의 이미지를 특정 위치에 표시하는 법을 실습하며 진행한다. getAttribute(), setAttribute() 이 두 함수는 HTML 태그의 속성을 가져오거나 수정하는 함수이다. 위에서 말한 기능을 구현하기 위해서는 - 1) 작은 이미지의 src 속성에 접근해 그 값 알아내기 (querySelector, getAttribute) 2) 큰 이미지의 src 속성을 알아낸 값으로 변경하기 (getAttribute, setAttribute) 두 가지를 수행하면 된다. 우선 이미지의 HTML 코드를 살펴보자. 여기에는 id값이나 class가 없기 때문에, img 태그를 이용해 접..
[Javascript] 8장. 웹 문서를 다루는 방법, 문서 객체 모델 (DOM) (1, 2)
2022. 11. 30. 17:25
스스로 공부하기/Javascript
08-1. 문서 객체 모델이란? DOM은 앞서 6장에서 객체를 다루며 설명한 적이 있다. (6장 링크) DOM (문서 객체 모델, Document Object Model) 은 자바스크립트를 이용해 웹 문서를 제어하기 위해 사용되는 내장 객체를 말한다. 문서 객체 모델의 정의 DOM은 Document Object Mode의 준말로 돔이라고 읽는다. 문서 객체 모델을 DOM이라고 표기한다. DOM이란? 웹 문서의 모든 요소를 자바스크립트를 이용해 제어할 수 있도록 객체를 사용해 문서를 해석하는 방법 EX) 웹 문서의 텍스트, 이미지, 표 등은 모두 문서 객체 모델에 해당한다. 이게 무슨 말일까? DOM을 이용하지 않고 상세 설명 가리기 상품 정보 원산지 : 에디오피아 지 역 : 이르가체프 코체레 농 장 : ..
[Javascript] 7장. 배열을 쉽게 다루자! Array 객체 (3)
2022. 11. 26. 16:39
스스로 공부하기/Javascript
07-3. 여행 준비물 점검 프로그램 만들기 지금까지 Array 객체와 그 대표적인 함수들의 기능에 대해 알아보았다. 이제 이를 활용하여 여행 준비물 점검 프로그램을 만들어 보자. 1. 필요한 기능, 실행 순서 설정하기 준비물을 추가하고 지울 수 있는 프로그램 작성 2. 만드는 과정 미리 생각해 보기 - 배열 만들기: 준비물이 들어가 있는 배열을 만든다. (저장되어 있는 공간) - 챙길 물건 배열에 추가하기: 원하는 위치에 추가하기 위해서 push() 함수를 사용한다. - 추가한 내용 화면에 표시하기: for문을 이용해야 할 것이다. - 챙긴 물건 배열에서 삭제하기: 특정 위치의 목록을 삭제하기 위해서 splice() 함수를 사용한다. 3. 입력 필드 만들기 여행 준비물 점검 목록 추가 먼저 이런 식으로..
[Javascript] 7장. 배열을 쉽게 다루자! Array 객체 (1, 2)
2022. 11. 23. 20:06
스스로 공부하기/Javascript
여러 개의 항목을 하나의 변수에 저장해야 할 때 -> 배열 (array) 를 사용한다. 07-1. 객체란? Array 객체로 배열 만들기 - 리터럴 표기법으로 객체 만들기 / 객체의 인스턴스를 이용해 배열 만들기 2가지 방법이 있다. - 전자는 3장에서 다루었으므로, 후자에 대해서 서술한다. Array(); 객체가 만들어져 있으므로 그냥 인스턴스를 선언하면 된다. 예약어는 마찬가지로 new 사용 > var myArray = new Array(); 배열의 크기 지정 시 괄호 안에 숫자 쓰기 숫자 쓰지 않을 경우, 얼마든지 많은 자료 표기 가능 -초기값이 있을 경우 > var numbers = ["one", "two", "three", "four"]; // 리터럴 표기법 > var numbers = new ..
[알고리즘] 그래프와 관련된 개념
2022. 11. 12. 15:51
스스로 공부하기/알고리즘
그래프 (graph) 유향 그래프, 방향 그래프 (directed graph) 루프 (loop) 다중 그래프 (multigraph) 가중 그래프 (weighted graph) 경로 (path) 단순 경로 (simple path) 연결과 강한 연결 (connectivity, strong connectivity) 순환 (cycle) 단순 순환 (simple cycle) 차수 (degree) 연결 그래프 (connected graph) 연결 요소 (connected component) 유향 비순환 그래프 (directly acyclic graph, DAG) 위상 정렬 (topological sort) 완전 그래프 (complete graph) 이분 그래프 (bipartite graph) 인접 행렬과 서로 다른..
[Javascript] 6장. 여러 자료를 한꺼번에 담는 객체
2022. 11. 11. 19:05
스스로 공부하기/Javascript
06-1. 객체란? 객체 (object) 란, 자바스크립트 자료형의 일종으로, 여러 변수와 함수 등 여러 가지 자료형을 묶은 하나의 자료형 ("복합 자료형") 자바스크립트는 객체 기반 언어이므로, 객체는 자바스크립트에서 자료를 처리하고 저장하는 기본 단위가 된다. 객체 간단히 살펴보기 var book = { title : "자바스크립트", // 자료형 : string author : "홍길동", pages : 500, price : 1500, .... }; // :와 ,으로 객체의 변수를 구분한다. 이렇게 한 개의 변수 안에 여러 가지 변수와 함수를 묶어서 저장한다. 선언방식에는 두가지가 있다. (06-2에서 다룸) ex) 회원가입 -> 회원의 정보를 "회원" 객체에 여러가지 정보를 묶어 저장하는 방식으..
[알고리즘] 빠른 거듭제곱 알고리즘 (bit set을 이용한 빠른 거듭제곱)
2022. 11. 1. 16:15
스스로 공부하기/알고리즘
상아탑 6주차 중 거듭제곱을 빠르게 계산하는 알고리즘 (ex. 3^2500000000....) 우선 지수를 이진법으로 표현하고, 이것을 exp로 설정 base = 밑 #include int power(base, exp) { int ret = 1; // 결과값을 1로 우선 설정 while(exp){ //exp가 존재하는 동안 = 자릿수를 모두 이동하는 동안 if(exp & 1 == 1) ret *= base; //1번째 자리가 1일 경우 ret*=base exp >>= 1; //오른쪽 옆으로 한 칸씩 이동 base *= base; //base를 제곱해줌. 이진법에 따라 자릿수 이동할 때마다 실제 숫자는 제곱 } return ret; //ret값을 반환 } 위와 같은 코드를 이용해 bit set을 응용한 빠..
[알고리즘] 백트래킹, 완전 탐색 (1182 부분수열의 합 - C++)
2022. 9. 18. 20:13
스스로 공부하기/알고리즘
백준 1182번 소스코드 #include #include #include #include using namespace std; int result = 0; int S, N; int arr[20]; void backtracking(int idx, int sum){ sum = sum+arr[idx]; if (idx >= N) return; if (sum == S) result++; backtracking(idx+1, sum); backtracking(idx+1, sum-arr[idx]); } int main(void){ cin >> N >> S; for(int i=0; i> arr[i]; } backtracking(0, 0); cout = N) return; //N이 넘을 경우 return하여 함수 종료 i..