[JavaScript] 생활코딩 34 ~ 37 _ JS파일, Library, Framework, UI, API 안녕하세요~ 보라해바라기입니다. 주말이 되면 귀차니즘이 증가하는 이유는 무엇일까요..?! 오늘도 침대에서 겨우 몸을 일으켜 책상에 앉았네요 ㅎㅎ 긴 말 필요없이 바로 렛츠기릿! 1. 파일로 쪼개서 정리정돈하기 앞서 구현해본 주/야간모드는 JS언어로 작성하였죠?! 어떻게 보면 각 파일에 상당히 긴 코드가 중복되어있다는 것을 알 수 있어요. 이럴 때, js 파일을 따로 만들면 유지 보수하기도 편리하고 더 효율적인 코딩이 가능하답니다! colors.js 파일에 var Links = { setColor:function (color){ var alist = document.querySelectorAll('a'); var i = 0; while(i < alist.length){ console.log(alist[i]..
썸네일 [JavaScript] 생활코딩 29 ~ 33 _ 객체 (쓰기와 읽기, 반복문, property, method, 활용) 안녕하세요! 보라해바라기입니다. 오늘의 tmi를 말하자면.. 저는 곰돌이 네일을 받고 왔답니다 ㅎㅎ 곰돌이 네일.. 정말 귀여워요 ㅠㅠㅠ 제가 좋아하는 보라색으로 해서 더 마음에 들더라구요! 이번에 네일 받는게 2번째인데 확실히 손톱이 얇아진게 느껴졌어요 ㅠㅠ 하지만.. 생손톱을 보면 허전함이 느껴진달까..?! 갑자기 급 네일블로그가 될 뻔 했어요 ㅎㅎㅎ 오늘은 객체에 대해 알아볼거예요! 그러면 오늘도~ 렛츠 기릿~ 1. 객체 저번에 배운 함수에 대해 기억하시나요~? 함수를 기반으로 하여 객체라는 개념을 설명할 수 있어요! 위 예시에서 body의 글씨 색과 배경 색을 함수를 이용해 나타내어 중복을 최소화했어요! 객체를 이용해서도 똑같은 기능을 구현할 수 있답니다? 2. 객체 쓰기와 읽기 배열과 객체에 대..
썸네일 [JavaScript] 생활코딩 24~28 _ 함수( basic, parameter, argument, return, 활용) 안녕하세요! 보라해바라기입니다. 저는 어제부터 온라인 교환학생 수업을 듣고 있는데요 ^_^ 오늘 조별 발표가 있는 날이었어요. 저는 어제 알바때문에 시간이 많이 없어서 시간을 쪼개서 겨우 완성했것만... 오늘 교수님의 몸 상태가 안 좋으셔서 갑작스런 휴강을 하게 되었어요...! 맨 처음에는 허탈하더군요 ㅠㅠ 어제 하루가 너무 정신없이 휘몰아치기도 했고 급하게 할 필요가 없었는데 말이죠. 뭔가 손해봤다는 생각도 들고요.. 하지만! 어짜피 다음 주에 발표를 할 것이고 무엇보다도 코딩 공부를 할 시간이 생겼잖아요? 그래서 좋게 생각하기로 했어요 ㅎㅎ 그러면 저의 소소한 에피소드와 함께 렛츠 기릿-! 1. 함수 : 기초 함수라는 말은 수학 시간에 많이 들어보셨을텐데요! JS에서도 함수는 효율적인 코드를 짜는데 ..
썸네일 [JavaScript] 생활코딩 19~23 _ 배열, 반복문과 그 활용 안녕하세요~ 보라해바라기입니다. 저번 시간에 주/야간모드를 구현해보았는데요! 야간모드를 실행시켰을 때, 링크 색이 어두워 잘 안보이는 불상사가 생기더라고요... 물론 링크 색 변경을 통해 해결할 수 있지만!! 오늘은 배열과 반복문을 사용하여 이 문제를 해결해보려 합니다 ㅎㅎ 오늘도 저와 같이 렛츠기릿 하실까요~? 1. 배열 배열이라는 말은 일상생활에서 많이 들어보셨을텐데요! 그렇다면 JS에서 말하는 배열이란 무엇일까요? 배열은 데이터가 많아짐에 따라, 데이터 중에 서로 연관된 데이터를 잘 정리정돈해서 담아두는 일종의 수납상자랍니다~ 책을 데이터로, 책장을 배열이라고 생각해볼까요? 여러 종류의 책(인문학, 사회과학, 의학, 종교학 등등)들은 책장의 각 공간에 분리되어서 정리됩니다. 이렇게 말이죠! 연관된 ..
썸네일 [JavaScript] 생활코딩 12~18 _ 제어 태그 선택, 비교연산자, 불리언, 조건문, 리팩토링 안녕하세요~ 보라해바라기입니다. 어제에 이어서 계속 날씨 얘기를 하게 되는데.. 어제 저희 학교에 심겨진 나무가 부러졌다는 이야기가 있더라구요...!! 제가 날씨 얘기를 또 하게 되는건 날씨가 제게 주는 임팩트가 커서 그런 것 같아요... ㅎㅎ 오늘은 내용이 꽤 많아서 얼른 시작해야겠어요~ 오늘도 렛츠 기릿!! 1. 제어할 태그 선택하기 저번 시간에 input을 이용해서 버튼과 그 이름을 설정하고 다양한 event를 실행해보았답니다! 이번에는 night 버튼과 day 버튼을 각각 생성해서 버튼을 클릭했을 때, 배경과 글씨 색이 바뀔 수 있도록 설정해볼게요~ 2. 비교연산자와 불리언 비교연산자는 === 로 나타내며 좌항과 우항이 같은가를 비교하는 연산자랍니다~ 예시를 살펴보면 Comparison Opera..
썸네일 [JavaScript] 생활코딩 6~11 _ 문자열과 숫자, 변수와 대입연산자, 웹브라우저의 제어(CSS) 안녕하세요~ 보라해바라기입니다! 어제 초복이었는데 다들 알고 계셨나요?! 저도 어제 치킨을 먹었답니다 ㅎㅎ (사실 치킨을 시키고 생각해보니 초복인 걸 깨달았어요...) 날씨도 무더워져서 불쾌지수도 높아지고 게으름 피우게 되는 것 같아요.... 하지만!! 더운 날씨를 꿋꿋하게 이겨내고 저는 오늘도 자바스크립트의 세계에 빠져보려 합니다...!!! 같이 갈 준비 되셨나용? 렛츠 기릿! ( 저 이모티콘 정말 마음에 들어요..ㅎㅎㅎ) 1. 문자열과 숫자 자바 스크립트에는 자료형(data type)이 존재하는데 대표적으로 문자열과 숫자가 있어요! 콘솔창을 이용해서 숫자와 문자가 어떻게 작동하는지 살펴볼 수 있답니다 ㅎㅎ 숫자를 계산할 때 쓰이는 산술연산자는 사칙연산을 생각하시면 이해하기 쉽겠죠? + : 덧셈 - :..