일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 웹개발자를위한자바스크립트의모든것
- 일러스트레이터강의
- css
- es6
- 노개북
- 일본워킹홀리데이이유서
- JavaScript
- 자바스크립트
- 독후감
- 패스트캠퍼스
- 7장오류처리
- flexbox
- 코딩 #개발자 #노마드북클럽 #노개북
- python turtle
- 디지털기초역량훈련
- 내일배움카드
- 일본워홀서류
- 3장함수
- 국비지원
- 파이썬
- 5장형식맞추기
- 일본워킹홀리데이계획서
- python
- 디스트럭처링
- 클린코드
- 9장단위테스트
- 파이썬터틀
- 바이트디그리
- 중첩된객체
- 플렉스박스
- Today
- Total
목록프로그래밍 언어 (9)
KARIU의 IT 블로그

디스트럭처링(Destrucuring) 이란? 배열의 값 또는 객체의 속성을 풀어서 별개의 변수로 쓸 수 있게 해주는 문법이다. 객체 디스트럭처링, 배열 디스트럭처링, 함수 디스트럭처링 등이 존재한다. 객체 디스트럭처링(Object Destructuring) 객체 디스트럭처링을 이용하면 객체가 가진 속성에 접근함과 동시에 해당 속성 이름으로 변수 선언이 가능하다. 예시 코드) const person = { name : "Kariu", nickname : "Ray", links : { blog : { tistory : "https://kariu.tistory.com", naver : "https://blog.naver.com/kari_578", }, email : "kariu@email.com", }, in..
ES6이 도입되기 전 까지 자바스크립트에서 함수를 선언할 때, 아래와 같은 방식을 사용하였습니다. function greeting(name) { return `Hello! ${name}` } console.log(greeting("Kariu"); 다른 프로그래밍 언어에서 함수를 선언할 때 위와 같은 방식을 많이 사용합니다. 이러한 방식은 매우 친숙하죠. 하지만 ES6 등장 이후로 자바스크립트에는 새로운 함수 선언 방식이 등장하였습니다. 화살표 함수(Arrow function)란? ES5에서 일반적으로 쓰인 전통적인 함수(위의 코드 참조)를 간편하게 표현할 수 있는 함수입니다. 위의 코드를 화살표 함수로 바꾸면 아래와 같습니다. const greeting = (name) => return `Hello! $..
Array.find() 제공된 테스트 함수를 충족하는 배열의 첫 번째 원소를 반환한다. 충족하는 원소가 없으면 undefined를 반환한다. 예시) const emails = ["kariu@naver.com", "ray@gmail.com", "kk@gmail.com", "greentea@hanmail.net"]; const foundMail = emails.find(item => item.includes("@gmail.com")); console.log(foundMail); 결과) ray@gmail.com emails 배열에는 여러 이메일 주소들이 저장되어 있다. 이중에서 gmail인 이메일을 찾고 싶어서 .find()를 사용하였다. 하지만 emails 배열 안에는 "ray@gmail.com", "kk@..

파이썬으로 크롤링을 하다가 태그가 중간중간에 들어있는 단락을 가져오는데 첫 번째 줄만 가져와지지 않는 현상이 발생하였습니다. 열심히 인터넷을 뒤져서 해결하였는데 방법을 공유하고자 포스트를 작성하게 되었습니다. 제가 가져와야할 텍스트입니다. 저 중에서 제목 아래에 있는 설명 부분을 가져와야 되는데 첫 줄은 가져와지지 않는 현상이 발생하였습니다. 먼저 개발자도구(크롬에서 F12 누르기)를 켜서 HTML 코드를 확인해보면 아래와 같이 나옵니다. 태그 안에 태그로 제가 원하는 정보가 감싸져 있습니다. 평소에 하던 대로 크롤링 코드를 작성하여 긁어왔습니다. 실행 결과를 보시면 첫번째 줄에 있는 글은 가져오지 않고 두 번째 줄의 글만 가져오는 것을 확인하실 수 있습니다. 아무래도 태그 안에 줄을 나눠주는 태그 때매..

파이썬으로 서울 지하철 데이터를 크롤링하다가 발견한 쉽고 간편한 방법이 있어서 소개합니다. 바로 위와 같이 모든 행들이 따로따로 분리 되어 있는 것이 아니라 노선의 "서울 지하철 4호선" 처럼 모든 행들이 하나로 합쳐져 있는 것도 있고 소재지의 "노원구" , "도봉구", "강북구" 등과 같이 임의적으로 쪼개져 행들이 합쳐져 있는 복잡한 표를 깔끔하게 가져오는 방법입니다. html_parser_table의 make2d를 이용하시면 깔끔하게 정보를 가져오실 수 있습니다. 1. 설치 html_parser_table의 make2d를 사용하기에 앞서 먼저 설치를 해줘야합니다. 위와 같은 명령을 터미널 창에 입력하여 html_parser_table을 설치합니다. 2. requests 요청과 해당 데이터가 있는 부분..

이번에는 길 위에 걸어 다니는 거북이들을 그려(찍어) 보겠습니다. 일단 길 위에 있는 거북이들을 파이썬 터틀로 표현하기 위해서 약간의 좌표 계산이 필요합니다. 전 600x600창을 만들어서 사용하였습니다. 만약 파이썬 터틀에서 600x600짜리 창을 만들었다면 좌표는 이러한 형식으로 지정됩니다. 양의 좌표의 최대는 300, 음의 좌표의 최대는 -300으로 총 합쳐서 600으로 구성이 됩니다. 이러한 특성을 생각하여 좌표 계산을 해보겠습니다. 일단 터틀 라이브러리를 불러오고 창 크기를 설정합니다. 그리고 갈색 길을 그려줄 커서와 거북이 모양을 찍어 줄 커서를 생성합니다. 1 2 3 4 5 6 import turtle turtle.setup(width=600, height=600) #창 크기 600x600 ..

터틀에 내장되어 있는 함수를 이용하여 위와 같이 다향한 도형을 그릴 수 있습니다. 위의 도형들 처럼 그리기 위해선 circle()이라는 함수가 필요합니다. circle()은 원을 그릴 때 쓰는 함수인데 삼각형이나 사각형을 그릴 때도 사용할 수 있습니다. 먼저 위의 사진에서 맨 왼쪽에 있는 원을 그려보겠습니다. 반지름은 50으로 지정하였습니다. 1 2 3 4 5 6 7 8 9 10 import turtle turtle.setup(width=1000, height=300) #터틀 창의 크기를 가로 1000, 세로 300으로 지정 t=turtle.Turtle() #터틀 불러오기 t.penup() #커서의 이동경로가 표시 안되게 t.goto(-400,0) #해당좌표로 커서 이동 t.color("red") #색깔..

1. 움직임, 그리기 명령어 forward(픽셀수), fd(픽셀수) : 현재 커서가 향하는 방향으로 지정된 픽셀수 만큼 이동 backward(픽셀수), bk(픽셀수), back(픽셀수) : 현재 커서가 향하는 방향의 반대로 지정된 픽셀수 만큼 뒤로 이동 right(각도), rt(각도) : 현재 커서가 향하는 방향으로 지정된 각도만큼 오른쪽으로 회전 left(각도), lt(각도) : 현재 커서가 향하는 방향으로 지정된 각도만큼 왼쪽으로 회전 goto(x,y), setpos(x,y), setposition(x,y) : 커서를 지정한 좌표(x,y)로 이동 setx(픽셀수) : 커서의 x좌표를 설정합니다. (y좌표는 바뀌지 않음) sety(픽셀수) : 커서의 y좌표를 설정합니다. (x좌표는 바뀌지 않음) set..