생활코딩

Coding Everybody

코스 전체목록

닫기

함수

함수의 기본

소스코드

변경사항

 

 

매개변수(parameter)와 인자(argument)

소스코드

변경사항

 

 

리턴

4:04초의 결과가 붉은색 5가 아닌 붉은색 23이 된 이유는 자바스크립트는 문자와 숫자를 더하면 숫자를 문자로 간주합니다. +를 덧셈이 아닌 문자 결합 연산자로 사용합니다. 그래서 2와 3이 결합되서 23이 된 것입니다. 아래와 같이  괄호를 사용해서 2와 3을 먼저 더해주셔야 합니다. 졸음강의를 찍은 것 같습니다 ㅠㅠ
document.write('<div style="color:red">'+left+right+'</div><br>');

소스코드

변경사항

 

 

댓글

댓글 본문
  1. Sansol Park
    실험 부분도 전체 코드를 같이 복사해서 보여주시면 더 좋을 것 같아요~

    실험
    1. 숫자(2)+숫자(3)+문자('3') = 33
    2. 문자('3')+숫자(1)+숫자(2)+문자('3') = 3123
    3. 문자('3')+숫자(1)+숫자(2) = 312
  2. Sansol Park
    소스코드 부분 주석에 설명이 나와있네요.

    4:04초의 결과가 붉은색 5가 아닌 붉은색 23이 된 이유는 자바스크립트는 문자와 숫자를 더하면 숫자를 문자로 간주합니다. +를 덧셈이 아닌 문자 결합 연산자로 사용합니다. 그래서 2와 3이 결합되서 23이 된 것입니다. 아래와 같이 괄호를 사용해서 2와 3을 먼저 더해주셔야 합니다.
    // document.write('<div style="color:red">'+(left+right)+'</div><br>');
    대화보기
    • 메론소다맛젤리
      혹시나 저처럼 이런 의문을 가진 사람들이 있을 수도 있어서 남기는 기록입니다.
      document.write(1+1+'<br>');
      숫자+숫자+문자로 구성되어 있으며 2를 출력합니다.

      document.write('<div style="color:red">'+2+3+'</div><br>');
      문자+숫자+숫자+문자로 구성되어 있으며 빨간 23을 출력합니다.
      설명에서 javascript는 문자와 숫자를 더하면 숫자를 문자로 받아들이기 때문에 2와 3을 더한 5의 값이 아닌 23을 출력하는 것이라 했는데 위의 상황도 문자와 숫자를 더하는 것이라 납득하기 어려울 수도 있다고 생각합니다.

      그래서 저는 한 가지 가설을 정해두고 실험을 해보았습니다.
      가설 : 문자 사이에 존재하는 숫자의 덧셈은 숫자를 문자로 바꾼다.
      실험
      1. 숫자(2)+숫자(3)+문자('3') = 33
      2. 문자('3')+숫자(1)+숫자(2)+문자('3') = 3123
      3. 문자('3')+숫자(1)+숫자(2) = 312

      실험 결과가 가설대로 나오지 않아 가설을 "문자로 시작하는 숫자와의 덧셈은 숫자를 문자로 바꾼다."로 수정해봤지만 이러한 결과가 나오게 된 뚜렷한 원인을 알 수가 없었습니다. javascript가 덧셈을 읽을 때 가장 앞에 나타나는 datatype인 문자를 인식하고 다음에 나오는 값들을 문자로 인식한다는 추측만 있지만 앞으로 이러한 상황이 생겼을 때 어떤 원인이 작용하여 숫자를 문자로 인식하게 되었는지 알고 싶습니다.
    • 푸른초
      23.01.16.
    • 최대리
      2023.01.05 완료
    • 감자
      22.11.28 복습 다시 시작!
    • 박진병
      22.11.21
    • 감사합니다.
    • 코딩왕초보
      2022.11.03 복습
    • 드가자
      아 머리아파
    • 코딩드림
      221023
    • 엠제이
      10212022
    • 보통사람 박코딩
      할수있다
    • 221018
    • 코딩왕초보
      2022.10.14 return은 너무 어렵네요.
    • 서우
      221011
    • 김세나
      221003
    • 한승욱
      220930
    • 정하늘
      220924
    • OKKZZI
      22/9/22
    • 당당
      2022.09.18
    • 22.09.01
    • 뿔고래
      함수가 return의 값으로 변신을 하게 되어서 함수를 값처럼 사용할 수 있게 되었다.
    • 헤밍웨이
      220810 감사합니다.
    • 열무
      document.write('<div style="color:blue;">'+(left+right)+'</div><br>');
      -> document.write(&#96;<div style="color:orange;"> ${left+right} </div>&#96;);
    • 코드만다
      22.07.27
    • 220724_
    • 진진리
      0719
    • 220711 함수 이론
    • ichenny
      2022.07.03
    • toonfac
      220703 오후 8시 59분 완료
    • 양빵
      220616
    • onehae
      220615 이해는 안되지만 일단은 따라해봤습니다. 하다보면 알게되겠죰
    • 탕탕
      220609
    • 진진리
      22.05.24
    • 220519
    • 울랄라
      220519
    • DH니스
      2022.04.15
    • 220409
    • 이윤
      220405
    • 너구리기린
      2022.03.31
    • 09년생개발자
      쉬워요!
    • Denyce
      휴 너무 이해하기 어려웠는데 다른 훌륭한 분들이 써주신 댓글 읽으며 겨우겨우 조금은 이해가 가는 것 같습니다!

      밑에 어느 분이 쓰신 것처럼 콘솔에
      function sumWrite(left, right){document.write(left+right);}
      sumWrite(2,3)
      라고 하면 5가 뜰 것 같은데 자꾸 undefined가 나와서 당혹스러웠는데 화면 창을 보니 5가 적혀있더군요.

      화면에 결과값을 write 하고는 콘솔에 돌아오는게 없어서 그랬나봅니다.

      그래서 다시
      function.sumReturn(left, right){return(left+right);}
      sumReturn(2,3)
      을 했더니 화면에는 5가 뜨지 않았지만 콘솔에는 5라는 값이 돌아와 있었습니다.

      출력 화면창과 콘솔의 관계가 정확히 어떻게 되는지 궁금해지네요!!

      그나저나 23으로 표시된 곳 문자와 숫자가 섞였다는 부분에서 문자는 어디를 의미하나요? div 태그인가요..? <br> 은 문자 취급이 안되나요…? ㅠㅠ갈수록 어려운 코딩의 세계입니다.
    • 지구
      2022.03.16 재수강 필요
    • new 개발자
      20220315
    • 0226민규
      0315 중간 점검
    • 임연주
      함수 특히 리턴은 잘 모르겠어요. 반복해서 들으면 이해가 갈 것 같아요.
    • 2022.02.24 완료
    • kizarrd10
      sum(2,3).style.color='white'; 처럼 진행하실 수 있습니다. sum()함수 내부에서 return을 사용해서 style을 바꾸고자 하는 html element object를 반환하도록 코드를 작성하면 됩니다. querySelector()도 함수(메소드)이고 실제로 querySelector().style.color='white'; 를 하면 스타일을 지정할 수 있는것과 같습니다.
      대화보기
      • 드림보이
        2022.02.17. WEB2 - JavaScript - 함수 파트 수강완료
      버전 관리
      egoing
      현재 버전
      선택 버전
      graphittie 자세히 보기