본문 바로가기

JavaScript136

Javascript) 작성 방식, 자료형 (string, number, boolean, object, function, undefined) 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. Javascript - 웹 브라우저에서 많이 사용하는 인터프리터 방식의 객체지향 프로그래밍 언어 Javascript 작성 방식 ① html 태그의 inline 이벤트 속성에 작성 html태그의 inline 이벤트 속성에 작성 ② 내부 script 태그 - head 태그 안, body 종료 태그 전 head 태그 안 body 태그 종료 전 Javascript html태그의 inline 이벤트 속성에 작성 내부 script태그 - head 태그 안, body 종료태그전 외부 script태그 - 현재 페이지에서 load ③ 외부 script 태그 - 현재 페이지에서 load // 스크립트 영역 .. 2022. 5. 17.
[JavaScript] 라이브러리와 프레임워크 (jQuery) 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 지금까지 포스팅을 통하여 제가 생산자의 입장에서 하나하나 개념 정리를 해보았는데요, 오늘은 타인이 만든 소프트웨어를 부품을 이용하여 만들고자 하는 것을 빠르게 구현시킬 수 있는 방법을 알아보겠습니다. Library와 Framework이라는 키워드가 있습니다. 두 가지 키워드는 다른 사람의 도움을 받아 소프트웨어를 만든다는 점이 비슷하지만 다소 차이가 있습니다. 라이브러리 각각 개별적인 기능들로 쉽게 말해 부속품 따라서 라이브러리는 그러한 부속품들을 가져다가 적용시키는 것 프레임워크 개별적인 기능들이 연결되어 기초적인 제품 골격을 갖춘 상태, 이를 기본 틀로 삼아서 그 위에 덧붙여 만드는 것 쉽게 말해 반제품 이러한 차이점이 있습니다. 저는 오늘 라이브러리 .. 2021. 9. 16.
[JavaScript] Include File / 파일로 쪼개어서 정리하기 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 지난 포스팅에서 JavaScirpt를 통하여 BackgroundColor와 Color를 변화시키는 로직을 최종적으로 구현시켜보았는데요, 오늘은 제가 만들었던 JavaScript를 파일로 쪼개어서 보다 효율적 이도록 해보았습니다. 지난 포스팅에서 최종적으로 작업한 script입니다. 파일로 쪼개어서 script를 나누는 이유 : ① 해당 내용이 다른 페이지에도 동일하게 적용시킬 시, 모든 페이지에 copy 하여 배포를 하기엔 효율적이지 못함. ② script 내의 내용이 변경될 경우, (ex. color가 red로 변경될 경우) 모든 페이지에 color를 변경시켜줘야 하는 번거로움 발생 ③ 페이지마다 어떠한 로직을 갖고 있는지에 대한 가독성이 좋아지며, 코드.. 2021. 9. 16.
[JavaScirpt] 객체 활용하기 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 이전 포스팅을 통하여 객체의 Create, Iterate, Property & Method 에 대해서 배워 보았는데요, 오늘은 이를 활용하여 이전에 완성 하지 못했던 코드를 완성 해보려고 합니다. 객체의 형식으로만 코드를 변경 해두고, 객체 생성을 하지 않아서 해당 코드로는 원하는 결과물을 출력할 수 없었습니다. 함수의 이름으로 중복되지 않도록 해두었던 코드들을 변경하여 하기와 같이 객체 생성을 해보았습니다. Body 객체 안에 let Body = {setColor:function (color){document.querySelector('body').style.color= color;}, setBackgroundcolor:function (color){do.. 2021. 9. 15.
[JavaScript] 객체 Create, Iterate, Property & Method 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 지난 포스팅에서 객체의 기본적인 정의와 형태에 대하여 공부해보았는데요, 오늘은 객체의 Create, Iterate, Property & Method에 대해 알아보겠습니다. (추가 설명) 객체와 비슷한 원리로 정보의 양이 많아졌을 때 서로 연관된 정보를 정리 정돈하기 위해 사용한 도구, 배열이 있었습니다. 배열은 순서에 따라서 정보를 정리한다는 특징이 있습니다. 또한, index를 활용하여 원하는 정보를 가져올 수 있었으며 순서대로 정보를 불러온다는 특징이 있었습니다. 반면에 객체는 순서 없이 정보를 저장할 수 있는 특징을 갖고 있으며, 객체에 저장된 정보를 다시 꺼내올 수 있도록 정보에 대한 이름(속성명)을 생성을 해주어서 저장해줍니다. * Create 배.. 2021. 9. 15.
[JavaScript] 객체의 기본적인 정의 및 형태 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 오늘은 객체의 기본적인 정의 및 형태에 대하여 포스팅 해보는 시간을 갖도록 하였습니다. * 객체의 정의 프로그래밍을 하다보면 코드가 많아지며, 코드를 정리 정돈하기 위해 함수를 사용함수를 많아지면 함수와 연관 되어 있는 변수들이 많아지므로, 복잡도의 한계에 도달하게 됨. 기본적인 정의 : 이러한 한계 상황에서 서로 연관된 함수와 연관된 변수를 동일한 이름으로 그룹화하여 정리 정돈하기 위한 도구 이전 포스팅에서 작성한 코드 중 var alist ~ i = i +1 ; 까지의 코드가 if절과 else 절에 반복되는 것을 최소화하고 싶었습니다. 해당 부분은 함수를 통하여 반복 되는 코드를 아래와 같이 해결할 수 있었습니다. setColor라는 함수를 이용하여 코.. 2021. 9. 15.