초중고등학생 자바스크립트 교재

📘 2.6.3 자주 틀리는 형변환 예제 - 함정을 피하는 지혜밤이 깊어가는 이 시간, 지금까지 자바스크립트의 상자 변환에 대해 차근차근 배워온 여정을 돌아봅니다. 이론도 익히고 기본적인 사용법도 배웠지만, 실제 코딩을 하다 보면 "어라, 이상하네요?"라고 작은 놀라움을 마주하는 순간들이 종종 찾아와요.이번 시간에는 많은 개발자들이 공통적으로 경험하는 상자 변환의 함정들을 함께 살펴보고, 이런 실수를 미리 방지하는 방법을 배워보겠습니다. 마치 구불구불한 산길을 안전하게 걸어가는 방법을 배우는 것 같아요.🧠 새로운 말들과 친해지기상자 변환 함정을 이해하는 데 필요한 주요 말들을 살펴보겠습니다.어려운 말쉬운 설명함정 코드작성자가 원하는 것과 다른 결과가 나오는 코딩 방식을 말해요.NaN (낫어넘버)"숫자가..

📘 2.6.2 암시적 형변환 (자동 변환) - 컴퓨터가 조용히 행하는 현명하지만 때로는 놀라운 자동 바꾸기석양이 창가에 부드럽게 내려앉는 이 저녁, 지난 시간에 배운 명시적 형변환을 떠올려봅니다. 우리가 직접 명령하여 상자의 내용물을 바꾸는 그 과정들 말이에요. 하지만 자바스크립트에는 또 다른 신비로운 기능이 숨어있답니다. 바로 우리가 특별히 부탁하지 않아도 컴퓨터가 조용히 자동으로 상자 종류를 바꿔주는 암시적 형변환이에요.이는 자바스크립트만이 가진 독특하고 아름다운 특징 중 하나입니다. 때로는 우리를 편안하게 해주지만, 때로는 "어라, 이상하네요?"라고 작은 놀라움을 선사하기도 하지요.🧠 새로운 말들과 친해지기오늘 새롭게 만날 말들을 차근차근 알아보겠습니다.어려운 말쉬운 설명암시적 형변환컴퓨터가 알..

📘 2.6.1 명시적 형변환 (String(), Number()) - 상자 안 내용물을 섬세하게 바꾸는 방법햇살이 창가에 살며시 내려앉는 이 오후, 여러분이 그동안 정성스럽게 만들어온 데이터 상자들을 떠올려봅니다. 숫자를 품은 상자, 글자를 간직한 상자, 참과 거짓을 담은 상자들까지. 저마다의 이야기를 간직한 이 상자들이 때로는 서로 다른 모습으로 변화해야 할 순간들이 찾아와요.문득 이런 순간이 있지요. "이 숫자 상자에 있는 소중한 내용을 글자 상자로 옮기고 싶어요" 또는 "이 글자 상자 안의 숫자를 진짜 숫자로 바꾸고 싶어요" 하는 마음이 생기는 순간들 말이에요. 이럴 때 우리에게는 상자 변환의 기능 String()과 Number()가 필요하답니다.🧠 새로운 말들과 친해지기오늘 새롭게 만날 말들을..

📘 2.5.2 언제 typeof를 사용할까요? - 상자 탐정이 되어야 하는 순간들창밖으로 부드러운 햇살이 비춰드는 이 오후, 지난 시간에 배운 typeof라는 소중한 탐정 도구를 떠올려봅니다. 이제 더욱 중요한 질문이 우리 앞에 놓여있어요. "그럼 언제 이 탐정 도구를 사용해야 할까요?"매번 모든 상자를 들여다보는 것은 너무 번거로울 테고, 그렇다고 확인하지 않으면 예상치 못한 일들이 일어날 수도 있지요. 오늘은 실제로 typeof를 언제, 어떻게 사용하는 것이 가장 현명한지 함께 알아보겠습니다. 마치 언제 우산을 챙겨야 하는지 아는 것처럼 자연스럽게 말이에요.🧠 새로운 말들과 친해지기오늘 새롭게 만날 말들을 차근차근 알아보겠습니다.어려운 말쉬운 설명타입 확인하기상자 안에 어떤 종류가 들어있는지 미리..

📘 2.5.1 typeof - 변수 안 보물의 정체를 알아내는 탐정도구따뜻한 봄날 오후, 교실 창가에 앉아 여러분이 그동안 만들어온 작은 데이터 상자들을 생각해봅니다. 숫자를 품은 상자, 글자를 간직한 상자, 참과 거짓을 담은 상자들까지. 저마다의 이야기를 품고 있는 이 상자들이 때로는 수수께끼 같기도 하지요.문득 이런 순간이 찾아옵니다. 상자를 바라보며 "이 안에는 무엇이 들어있을까?" 하고 궁금해하는 마음이요. 겉으로는 똑같아 보이는 상자들이지만, 그 안에는 서로 다른 종류의 소중한 것들이 숨어있답니다. 이럴 때 우리에게는 특별한 탐정 도구 typeof가 필요해요.🧠 새로운 말들과 친해지기오늘 새롭게 만날 말들을 차근차근 알아보겠습니다.어려운 말쉬운 설명typeof상자 안에 뭐가 들어있는지 알려주..

📘 2.4.2 계산해서 넣기 (+=, -=, *=, /=) - 한 번에 계산하고 저장하는 똑똑한 계산 도우미들안녕하세요, 여러분. 지난 시간에 기본 정리 도우미 =에 대해 배우면서, 값을 상자에 저장하는 방법을 익혔어요. 하지만 실제로 프로그램을 만들다 보면 같은 상자의 값을 꺼내서 계산한 후, 그 결과를 다시 같은 상자에 넣는 일이 정말 자주 일어나요. 예를 들어 게임에서 점수를 올리거나, 용돈에서 돈을 빼거나, 체력을 회복시키는 일들 말이에요. 이런 반복적인 일을 더욱 간편하고 똑똑하게 만들어주는 특별한 도우미들이 있답니다. 바로 계산 도우미들이에요.🧠 새로운 친구들과 만나보기계산해서 저장하는 일을 한 번에 해주는 똑똑한 도우미들을 소개해드릴게요.단어쉬운 설명계산 저장 도우미들계산과 저장을 동시에..

📘 2.4.1 기본 할당 (=) - 값을 상자에 넣어주는 정리 도우미안녕하세요, 여러분. 지금까지 우리는 변수라는 상자를 만드는 방법과 여러 가지 종류의 정보들에 대해 배워왔어요. 이제는 그 상자 안에 물건을 넣고, 필요할 때마다 다른 물건으로 바꾸는 방법을 자세히 알아볼 시간이에요. 바로 할당 도우미 =에 대한 이야기랍니다.여러분, 집에서 정리정돈을 할 때를 생각해보세요. "이 연필은 연필통에 넣고, 이 책은 책장에 넣어줘"라고 하면서 물건을 제자리에 넣잖아요? = 도우미가 바로 그런 일을 하는 똑똑한 친구예요.🧠 새로운 단어들과 친해지기정리 도우미 =와 관련된 중요한 단어들을 쉽게 알아보아요.단어쉬운 설명정리 도우미 (=)오른쪽에 있는 것을 왼쪽 상자에 넣어주는 똑똑한 도우미예요왼쪽= 기호의 왼쪽..

📘 2.3.3 ! - 참을 거짓으로, 거짓을 참으로 바꾸는 거울 검사관안녕하세요, 여러분. 지금까지 && 까다로운 검사관과 || 친절한 검사관을 만났었죠? 오늘은 정말 신기한 친구를 만나러 갈 거예요. 바로 ! 거울 검사관이랍니다.이 친구는 마치 거울처럼 모든 것을 정반대로 바꿔주는 신기한 능력을 가지고 있어요. 참을 거짓으로, 거짓을 참으로 만드는 특별한 일을 해요. 정말 신기하죠?여러분, 놀이공원에서 거울의 집에 가본 적 있나요? 키가 크게 보이기도 하고 작게 보이기도 하는 신기한 거울들이 있잖아요? ! 검사관이 바로 그런 거울을 가지고 있는데, 이 거울은 "참/거짓"을 반대로 보여준답니다.🧠 새로운 단어들과 친해지기우리가 만날 새로운 친구에 대해 쉽게 알아보아요. 마치 새로운 놀이 친구의 특별한..

📘 2.3.2 || - 하나만 맞아도 통과시켜주는 친절한 검사관안녕하세요, 여러분. 지난 시간에 모든 조건이 완벽해야만 통과시켜주는 까다로운 && 검사관을 만났었죠? 오늘은 정반대 성격을 가진 정말 친절한 친구를 만나러 갈 거예요. 바로 || 검사관이랍니다.이 친구는 마치 우리 할머니처럼 여러 조건 중 하나만 맞아도 기꺼이 통과시켜주는 따뜻한 마음을 가지고 있어요. "이것도 좋고, 저것도 좋고, 그것도 괜찮아!"라고 말하는 정말 관대한 성격이랍니다.여러분, 집에서 간식을 달라고 할 때를 생각해보세요. "과자나 사탕이나 아이스크림 중에 아무거나 하나만 주세요!"라고 하면, 그 중 하나만 있어도 기뻐하잖아요? || 검사관이 바로 그런 마음을 가진 친구예요.🧠 새로운 단어들과 친해지기우리가 만날 새로운 친..

📘 2.3.1 && - 모든 조건이 맞아야 통과시켜주는 까다로운 검사관안녕하세요, 여러분. 오늘 우리가 만날 친구는 참으로 신중하고 꼼꼼한 성격을 가진 && 검사관이에요. 이 친구는 마치 우리가 현장학습을 떠날 때, 모든 준비물을 하나하나 체크하시는 선생님 같은 역할을 한다고 생각해보세요.여러분도 경험해보셨겠지만, 현장학습을 가기 전에는 준비물 목록이 있죠. 체험학습비도 내야 하고, 동의서도 가져와야 하고, 도시락도 준비해야 해요. 이 모든 것이 다 갖춰져야만 버스에 탈 수 있어요. && 검사관이 바로 그런 일을 하는 친구랍니다.이 친구는 공정하고 정확해요. 모든 조건이 완벽하게 맞아떨어져야만 "좋아요, 통과!"라고 말해주거든요. 만약 하나라도 빠뜨리면 "아직 준비가 부족한 것 같아요"라고 부드럽게 알..