WEB2 - JavaScript

배열과 반복문

소스코드

변경사항

댓글

댓글 본문
  1. 푸른벚꽃
    coworkers[i] 가 2번 들어가는 이유가 궁금하신 분이 있을까봐 아래 답변을 위로 가지고 올라왔습니다.

    후니2년 전
    1. <a href="http://a.com/'+coworkers[i]+'">'+coworkers[i]+'</a>

    coworkers[i] 가 2번 들어가는 이유는

    왼쪽에 있는 coworkers[i] 는 그저 링크된 주소일뿐이구요

    오른쪽에 있는 coworkers[i]는 html 화면상에 나타내주기 위한 코드입니다.
    말이 좀 어려울수도 있는데 이해 하셨을련지 모르겠네요


    브라우저상에서 확인해보시면
    1. egoing을 눌러보세요
    2. 링크로 간 주소창의 주소를 봐주세요. http://a.com/egoing 이게 뜰겁니다.
    3. 나머지 leezche, duru, taeho를 순서대로 눌러서 주소창을 봐주시면
    http://a.com/leezche
    http://a.com/duru
    http://a.com/taeho
    로 표기되서 주소창에 출력 될겁니다.

    지금 바로 말씀드린게
    coworkers[i] 왼쪽에 있는 <a href="http://a.com/'+coworkers[i]+'"> 이 부분을 뜻합니다.

    오른쪽에 있는 +coworkers[i]+ 부분은 이해하셨을거라 생각하겠습니다.

    추가) 여기에 제가 이해한 것을 덧붙이자면
    간단히 말해서 첫번째 '+coworkers[i]+'는 내가 하이퍼링크를 눌렀을 때 나오는 창에서 주소가 http:~~~'+coworkers[i]+'로 나오게 만든 것입니다.
    즉, http://a.com/egoing 으로 나오게 만든 것이죠.
    원래 주소는 http://a.com/인데 '+coworkers[i]+'를 붙임으로써 달라진 것입니다.

    2번째는 모두 아시겠지만 리스트와 하이퍼링크가 들어간 텍스트로 '+coworkers[i]+'를 넣은 것입니다. 그래서 결과물로 li,a가 적용된 egoing, leezche 등이 나오게 됩니다.

    저도 헷갈려서 아래 댓글들을 쭉 읽다가 이해했네요
  2. 이유자
    오 저도 이 부분부터 오랜만에 보기시작한지라 ++ 의 존재가 왜 필요한지 궁금해서 댓글보던차에 설명 잘해주셔서 이해했습니다. 감사합니다.
    대화보기
    • Jojia
      템플릿 리터럴을 사용하면
      document.write(`<li>${coworkers[i]}</li>`);
    • 마아앙
      2021.01.18
    • 몰댕
      21.01.14 재밌습니다.
    • 걸어가는신사
      2021.01.14
    • T.Hwang
      완료~
    • younghwani
      완료!
    • 이현수
      2021.01.10(일)
    • jeisyoon
      감사합니다.
    • Moth
      document.write('<li> <a href="http://a.com/'+coworkers[i]+'">',coworkers[i],'</a></li>'); 링크에 variable을 끼워넣는 요상한 방법
    • 이동훈
      <!doctype html>
      <html>
      <body>
      <h2>Loop & Array</h2>
      <script>
      var arr = ['A', 'B', 'C'];
      </script>
      <ul>
      <script>
      var i = 0;
      while(i < arr.length) {
      document.write('<li><a href="http;//a.com/'+arr[i]+'" target=_blank">'+arr[i]+'</a></li>');
      i ++;
      }
      </script>
      </ul>
      </body>
      </html>
    • unknown
      이제부터가 프로그램 입문인듯.
      필살기 '++', coworkers.length ㄷㄷㄷ ㅂㄷ
      근데 볼때마다 느끼는게 요즘 메타는 html이라고 언급하기 무색할 정도로 마크업언어는 태그 뼈대만 사용하고 자바스크립트로 전부 때우는 것 같음. ㅇㅈ? 덕분에 콘솔 독해가 존나 어려웠는데 ㅅㅂㄻ.. 생코 꾸준히 보니까 참 좋네요 이 구간에서 떡상보는 듯 ㅅㅅ
    • 서울사이버대학을다니고
      GOOD
      대화보기
      • 서울사이버대학을다니고
        <!DOCTYPE html>
        <html>
        <head>
        <meta charset="utf-8">
        <title></title>
        </head>
        <body>
        <h1>loop & Array</h1>
        <script>
        var mola = ['a','b','c','d'];
        </script>

        <ul>
        <script>
        var i = 0;
        while(i<mola.length){
        document.write('<li><a href="ex7.html">'+mola[i]+'</a></li>');
        i++;
        }
        </script>
        </body>
        </html>
      • 샴파뉴
        2020.12.27
      • 조성호
        대박입니다.. 좋은정보감사해요
        대화보기
        • 썽민
          이제까지 강의를 잘 보고 있다가 답답한 부분이 생겼어요.
          html코드를 수정하고 나서 웹브라우저를 계속해서 새로고침 해줘야했던건데요.
          이 묹[를 해결 하려고 구글링 했어요.
          javascript html auto refresh라고요.

          <script>
          window.setTimeout(function () {
          window.location.reload();
          }, 5000);/*5000은 5초*/
          </script>

          Body태그안에 저 코드를 넣게 되면 5초마다 페이지가 새로고침 됩니다.
          유용하게 잘 작동하는군요.

          여러번 강의를 들으면서 어떻게 구글링을 해야하는지 이제서야 활용하게 됬네요.
        • 20201210
        • 둘기
          오오 이해가 안됐었는데 이렇게 자세히 설명해주셔서 정말 감사합니다:)!!
          대화보기
          • 끼요오옷
            여러 객체를 출력할때 변수와 변수를 구분/연결해준다고 생각하시면 편할 것 같아요. 가령 i라는 위의 변수를 coworker[i]와 출력하고 싶다면 document.write(i+coworker[i]); 라고 적어주어야겠죠. 만약 +라는 구분자가 없으면 icoworker[i]로 받아들이면서 에러가 나겠죠. 이해에 조금이라도 도움이 되었으면 좋겠네요.
            대화보기
            • 둘기
              20.12.03 완료
              '+coworkers[i]+' -> coworkers 양 옆에 +를 왜 해야되는지 이해가 안되네요..ㅜㅜ 그냥 공식인가요? 아니면 더한다는 의미로 해석하면 될까요?
            • 부챔개
              20.12.02
            • 20201201
            • 듀리
              2020.11.26
            • Zzangbae
              20.11.23 완료
            • kkn1125
              20.11.23 완~료!
            • 푸쿠하
              '20.11.20 완료
            • Dominic
              thirteen(13) November 2020
            • 하양색
              혼자서 하려고했는데 +를 생각못했네요. 감사합니다 ㅎㅎ
            • 완료
            • 2020.11.02.MON.
            • 바부대지
              20.10.27 반복문과 배열
            • 제예솔
              힝 너무 어려워요ㅠㅠ
            • 웹짱
              2020.10.22 배열 반복문 이용 출력
            • 문성석
              2020.10.19 완료
            • 922
            • andrew070124
              <a href = "https://www.naver.com/'+coworkers[i]+'"> 라고 하면 각각 coworkers의 페이지에 들어가는것도 가능하겠네요
            • chapter5447
              완료하였습니다
            • H-mechanic
              20.09.08
            • 허우룩
              2020.09.04
            • banaba
              8/29 완료!
            • 난지단지
              완료!
            • 김요한
              2020.08.20 완료
            • JaanMun
              2020. 08. 18 완료
            • 16.08.20완료
            • smr0417
              2020.08.16 완료
            • Jay1025
              2020.08.06 완료
            • 장정민
              즐코즐코
            • Jae Hwan Suh
              20.08.03 피니쉬
            버전 관리
            egoing
            현재 버전
            선택 버전
            graphittie 자세히 보기