코딩 도전기_05_210702

18952 단어 스파르타코딩클럽개발/학습일지개발/학습일지

학습 내용

- Java Script 기초문법 연습

(1) 서울시 미세먼지가 40 초과인 구 이름 & 값

for (let i=0; i < mise_list.length; i++) {
    let gu_name = mise_list[i]['MSRSTE_NM']
    let gu_mise = mise_list[i]['IDEX_MVL']
    if (gu_mise>40) {
    console.log(gu_name, gu_mise)
  }

}
  • i는 0이고, i가 미세리스트의 항목 수보다 적을 때까지 i 출력을 반복한다. (기본 반복문)
  • gu_name은 미세리스트의 i번째의 'MSRSTE_NM'이다.(리스트, Dictionary)
  • gu_mise는 미세리스트의 i번째의 'IDEX_MVL'이다.
    (리스트, Dictionary)

Ex) 아래 항목은 미세리스트의 0번째 항목이며 해당 항목의 gu_name은 중구, gu_mise는 31이다.

{
    MSRDT: "201912052100",
    MSRRGN_NM: "도심권",
    MSRSTE_NM: "중구",
    PM10: 22,
    PM25: 14,
    O3: 0.018,
    NO2: 0.015,
    CO: 0.4,
    SO2: 0.002,
    IDEX_NM: "좋음",
    IDEX_MVL: 31,
    ARPLT_MAIN: "O3",
  },
  • 이런 조건에서, gu_mise가 40보다 큰 gu_name과 gu_mise를 출력하라.
    (조건문)

(2) 자전거가 5개 이하인 정류장의 이름

for (let i = 0; i < bikes.length; i++) {
	if (bikes[i]['parkingBikeTotCnt'] <= 5) {
		let station = bikes[i]['stationName'];
		console.log(station);
	}
}
  • i는 0이고, i가 자전거 리스트의 항목 수보다 적을 때까지 i 출력을 반복한다. (기본 반복문)
  • 자전거 리스트의 i번째의 'parkingBikeTotCnt'가 5보다 작거나 같고
    (리스트, Dictionaray, 조건문)
  • staion은 bikes의 i번째의 'stationName'이라고 정의할 때, staion을 출력하라.
  • 강의 3회 반복 청취 후 개인 연습
  • 소괄호, 중괄호, 대괄호 아직 헷갈림, 연습 해야함
  • 코드를 한 줄씩 뜯어서 보는 연습이 더 필요

목표[1] 진행 상황

  1. 결과
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>NAVER_prac</title>
    <style>
        .first-row {
            text-align: right;
            font-size: 13px;
            margin-right: 50px;

            display: block;
        }

        .jr-naver {
            text-decoration: none;

            color: lightgray;
        }

        .happy-bean {
            text-decoration: none;

            color: lightgray;
        }

        /*하이퍼링크 <a> 편집하고 싶을 땐 이렇게*/
        .main-logo {
            /*하이퍼링크 밑줄 없애기*/
            text-decoration: none;

            width: 150px;
            color: #03c75a;
            font-size: 45px;
            font-weight: bolder;
        }

        .logo {
            width: 1000px;
            height: 100px;
            padding-top: 10px;
        }

        .search-btn {
            color: white;
            font-size: 15px
        }

    </style>
</head>


<body>
    <div class="first-row">
        <a href="http://help.naver.com/support/contents/contents.help?serviceNo=1074&categoryNo=16719" target="_blank"
           style="text-decoration: none; color: black;">네이버를 시작페이지로</a>
        <button>></button>
        <a href="https://jr.naver.com/" target="_blank"
           style="text-decoration: none; color: lightgray;">쥬니어네이버</a>
         <a href="https://happybean.naver.com/" target="_blank"
           style="text-decoration: none; color: lightgray;">해피빈</a>

    </div>
    <div class="logo">
        <h1>
            <a class="main-logo" href="http://naver.com/" target="_blank">NAVER</a>
            <!--    검색창<input> 꾸밀 때는 옆에 <style> 따로 달고 똑같이 css편집-->
            <input type="text" style="width:400px;height:40px; padding-right:150px; border: 2px solid #03c75a;">
            <button class="search-btn" style=": white; width:50px; height:45px; background-color: #03c75a;
                            border: 2px solid #03c75a;">검색
            </button>
        </h1>

    </div>
    <div>
        <hr>
        <span style="color:#03c75a">메일 카페 블로그 지식IN 쇼핑 쇼핑LIVE Pay TV</span>
        사전 뉴스 증권 부동산 지도 VIBE 책 웹툰 더보기
        <button>></button>
        <hr>
    </div>
</body>
</html>

  1. 내용
    : 기존 파일에 하이퍼링크 추가

  2. 세부 수정 사항

  • 쥬니어네이버 텍스트에 쥬니어네이버 페이지로 가는 하이퍼링크 추가
  • 해피빈 텍스트에 해피빈 페이지로 가는 하이퍼링크 추가
  1. 자가 점검
  • 자바스크립트 기본 문법 공부하느라 네이버 연습파일을 많이 만지지 못함. 다음주부터 시간 더 할애할 것.
  • 부트스트랩 이용해 조금 더 완성도 있게 수정해야함

목표[2] 진행 상황

  • 구상 단계
알고리즘 (소수구하기 / 에라토스테네스의 채)
Week3 - JavaScript (16)

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage