Strength & Conditioning

forEach forEach() 는 array안의 각 item에 대해 function을 실행할 수 있게 해준다. array.forEach(function) 식으로 활용되며, 위의 그림처럼 function을 따로 작성 후 () 안에 넣어도 되고, () 안에서 펑션을 정의해도 된다. function Hello(item){ console.log("hello", item)} array.forEach(Hello) 해석: function Hello는 console에 hello + item 이라고 보여줄 것이다. array의 각 item들에 function Hello를 실행시켜라. = array.forEach((item) => console.log("hello", item)) 해석: array의 각 item들을 co..

parentElement 새로 생성되는 요소들 사이에서 구분이 필요한 경우, 위와같이 .parentElement 를 사용하여 해당 요소의 부모element를 특정할 수 있다. 이렇게 문자로만 보았을 때는 같은 .. 지만, 실제로는 위의 그림과 같이 특정되어 있는 모습을 확인 할 수 있다. 활용하면 이런식으로 새로 생성된 것들 중, 해당하는 것만 삭제할 수 있다. push() 이미 만들어놓은 array에 요소를 추가하고 싶은 경우, .push() 를 사용한다. 해당 array.push(넣고 싶은 요소) 를 하면 위의 그림의 console.log로 확인했듯이 요소가 추가된다. setItem localStorage 에 정보를 저장하고 싶을 때 사용. localStorage.setItem( key 값, Valu..

new Date() new Date(); 코드를 실행한 시점을 가져올 수 있음. .getDate() .getHours() .getMinutes() 등 으로 필요한 정보만 가져올 수도 있음. setInterval() setInterval(a, b); a를 b/1000 초 마다 실행 setTimeout() 하면, 매초마다 실행이 아니라, b/1000초 후 1번만 호출. padStart() "n".padStart(a, "b"); n의 길이가 a(maxLength)보다 적은 경우, 부족한 만큼 앞 자리에 "b"를 채워줌. padEnd() 하면, 부족한 만큼 뒷 자리에 "b"를 채워줌. Math.random() Math. 를 이용하여 다양한 것들을 할 수 있다. 그중 .random()을 하면 0~1 사이의 랜덤한..

small point 사소한 주의점 1. script 링크에 폴더명 미기제 폴더 단위로 파일을 나눈 후, 제대로 링크를 걸지 않으면 작동하지 않는다. '"폴더명"/'을 꼭 파일명 앞에 붙이자. 2. String 만 입력되는 경우 padStart() 와 같이, argument로 string만 받아들이는 경우도 있다. 그럴 때는 String() 로 감싸주면 string로 인식된다. 3. Backtick ' 은 무엇인가? `` 은 위와 같이 쓰이며, 큰 따옴표(")없이도 띄어쓰기를 읽을 수 있으며, 변수를 다룰 시에는 ${}를 사용하여 다룬다. 이런 식으로 깔끔하게 활용되기도 한다. 4. querySelector 활용 시 경로가 잘못된 경우. querySelector 사용시 그림의 첫번째 줄처럼, 이미 만들어..

Divide and conquer 세분화해서 관리하기 ex: 한 파일에 다 때려박지말고, 서로다른 기능에 대해서 기능별로 따로 파일을 만들어 관리한다. 장점: 관리하기 쉬워짐. 코드가 더 짧아짐. Event 이벤트 만들기 변수 사용시 event로 통일 function xxxxxxxx() 에서 ()에는 어떤 문자를 넣어도 후에 활용할 수 있지만, 특별한 경우가 아니라면 다른 작업자나 미래의 본인을 위해서 (event)로 통일후 활용하기.

Computer Concept & Practice(컴퓨터 개념 및 실습) 컴퓨터에 대해서 배우기전에 개론의 역할을 하는 "Computer Concept & Practice(컴퓨터 개념 및 실습)" 수업. 컴퓨터를 처음 접하는 학생들을 대상으로 컴퓨터에 대한 일반적인 기초개념 등을 설명하고, 프로그램이 수행되는 과정과 프로그램 작성을 위한 논리적인 사고에 대하여 강의한다. 오늘 강의에서는 지금 보기엔 구식 처럼 보이지만, 뜯어보면 지금과는 크게 다르지 않은 Von Neumann Model에 대해 알아보도록 하자. The stored Program Computer 우선 stored program computer 이란, program 자체가 memory에 있는 computer를 말한다. 이전에는 배선을 조정하..

Visual Studio Code 사용법 비주얼스튜디오 사용법 홈페이지 https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code.visualstudio.com 첫 화면에 뜨는 Download for Windows 클릭하면 됩니다. (M..

Computer Concept & Practice(컴퓨터 개념 및 실습) 컴퓨터에 대해서 배우기전에 개론의 역할을 하는 "Computer Concept & Practice(컴퓨터 개념 및 실습)" 수업. 컴퓨터를 처음 접하는 학생들을 대상으로 컴퓨터에 대한 일반적인 기초개념 등을 설명하고, 프로그램이 수행되는 과정과 프로그램 작성을 위한 논리적인 사고에 대하여 강의한다. 오늘 강의에서는 컴퓨터가 어떻게 abstraction의 단계를 거치는지 알아보자. 컴퓨터는 결국 아주 작은 장치들의 abstraction의 결과물이다. 어떤 것들이 abstraction 컴퓨터가 될 수 있었는지 알아보도록 하겠다. What is semiconductor? (반도체란 무엇인가?) conductor(도체) - 전류가 흐르는 ..

Computer Concept & Practice(컴퓨터 개념 및 실습) 컴퓨터에 대해서 배우기전에 개론의 역할을 하는 "Computer Concept & Practice(컴퓨터 개념 및 실습)" 수업. 컴퓨터를 처음 접하는 학생들을 대상으로 컴퓨터에 대한 일반적인 기초개념 등을 설명하고, 프로그램이 수행되는 과정과 프로그램 작성을 위한 논리적인 사고에 대하여 강의한다. 오늘 강의에서는 컴퓨터가 정보를 표현하는 방법에 대한 주요개념을 알아보자. 컴퓨터안에서는 모든 정보가 0,1로 표시된다. (binary로) 이걸 이용해 컴퓨터가 어떻게 다양한 data를 표현하는가에 대해서 알아보도록 하겠다. Computer is a "binary" "digital" system. Digital system: 표현하는 s..

Computer Concept & Practice(컴퓨터 개념 및 실습) 컴퓨터에 대해서 배우기전에 개론의 역할을 하는 "Computer Concept & Practice(컴퓨터 개념 및 실습)" 수업. 컴퓨터를 처음 접하는 학생들을 대상으로 컴퓨터에 대한 일반적인 기초개념 등을 설명하고, 프로그램이 수행되는 과정과 프로그램 작성을 위한 논리적인 사고에 대하여 강의한다. 오늘 강의에서는 전체적인 큰 그림과 2가지 정도의 주요개념을 알아보자. 우선 핵심개념 중 하나인, Abstraction(굳이 번역하면 '추상화'가 제일 나을 것 같다. 하지만 단어 그자체로 알고 있는게 좋을 것 같다.)에 대해서 배워보자. Abstraction Abstraction은 간단하게 말하면 복잡한 구조들을 다루기 쉽게 추상화하는..