본문 바로가기

LearningJavaScript

13. HTML & CSS HTML (HyperText Markup Language) Definition Eventhough it's not exactly a computer language, but a standardized system used to create webpages. "HyperText" refers to the hyperlinks that an HTML page may contain. "Markup language" refers to the way tags are used to define the page layout and elements within the page. Most Commonly Used Tags in HTML vs. ...: Division "div 태그는 한 줄을 차지합니다" ...: Span.. 더보기
12 객체지향 JavaScript 객체 지향 프로그래밍이란? 하나의 모델이 되는 청사진(blueprint)을 만들고, 그 청사진을 바탕으로 한 객체(object)를 만드는 프로그래밍 패턴.. 청사진이 곧 class가 되고 객체는 instance가 된다. ES5에서는 클래스를 함수로 바로 정의가 가능합니다. function Car(brand, name, color) { // 인스턴스가 만들어질 때 실행되는 코드 } ES6에서는 class라는 키워드를 이용해 정의할 수 있습니다. class Car { constructor(brand, name, color) { // 인스턴스가 만들어질 때 실행되는 코드 } } 클래스의 경우 위에 있는 "Car"에서 볼 수 있듯, 첫글자를 항상 대문자로 쓴다. new keyword는 클래스의 인스턴스를 만드는.. 더보기
11. Scope & Closure Scope Scope defines where variables can be accessed or referenced. Q1. let greeting = 'Hello'; function greetSomeone() { let firstName = 'Josh'; return greeting + ' ' + firstName; } 위를 보고 아래 질문에 답해보세요. greetSomeone()은 무엇이 될까요? firstName은 무엇일까요? . . . . . . . . . . . . . . greetSomeone()은 'Hello Josh'가 되지만, firstName은 undefined 또는 'Josh'가 아닌 ReferenceError: firstName is not defined라는 "참조할 수 없다"를 .. 더보기
9. Version Control System and Git git에 대해서 Why use version contorl? store different versions restore previous versions understand what happend (may see the changes made in codes) collaboration (with other people) backup GitHub one kind of Version Control System a social platform for git users (리액트(페북이 만듬) 같은 유명 오픈소스도 깃허브를 사용함) open source: repository: 다양한 브랜치(단계)가 있다. 어떤 maintainer(fb)가 관리하는 리파지토리(react)에 내가 어떤 기능을 추가하고 싶다면, 직접 .. 더보기
8. CLI: Command Line Interface What's CLI, definition, purpose etc.. CLI는 GUI와 달리, 마우스와 각종 UI컴포넌트 대신, 표준 입출력 시스텝을 통한 입력과 그에 따른 결과를 출력하는 형태로 나타난다. 컴퓨터의 시작이 GUI가 아닌 CLI이었다는점, 마우스나 터치같은 직관적인 UI형태는 시대를 거쳐 후에 나타난 것. CLI는 강력하고 빠른 배치 작업들을 수행할 수 있고, 특히 가장 많이 보편적으로 사용되는 Unix/Linux 시스템을 알기 위해서도 많은 부분을 CLI를 필요로하기 떄문에 여전히 유용하다. 접근성도 좋다는데 원격으로 서버에 접근할 수 있다고한다. GUI: graphic user interface, we're probably more familir with it, but need more.. 더보기
7. 객체 code로 아래 4 액션이 가능해야 할 것! create read update delete 배열과 가장 큰 차이점: - 객체는 어떤 항목이 어떤 정보를 담고 있는지 설명 할 수 있다. - 단순히 순서만 갖고 있는 배열과 달리, 정보에 의미 부여를 할 수 있다. let tweet = { writer: 'stevelee', createdAt: '2019-09-10 12-03:33', content: '프리코스 재밌어요!' }; Dot notation 객체이름.키이름 tweet.content // "프리코스 재밌어요!" Bracket notation: 키값이 변할 때 bracket notation을 써줘야함.. 왜? 객체이름['키이름'] tweet['content']; //"프리코스 재밌어요!" tweet[".. 더보기
6. 배열 (arrays) 배열 정의 배열에 대해서 배열은 순서가 있는 값. 배열은 쉼표로 구분된 요소들로 이루어져있으며, 각 요소마다 index가 있다. index 는 "문자열"과 마찬가지로 0부터 시작한다. (문자열과 비슷하다는 점을 기억하며 어떻게 다른지 살표보면 더 좋을 듯) let myNumber = [73, 98, 86, 61, 95]; 배열은 대괄호[square bracket]안에 원소(element)를 넣어 만든다. 문자열과 비슷하게 index를 이용해 값에 접근이 가능하지만, 문자열과 다르게, 값을 변경할 수도 있다. 위의 myNumber배열의 3번째 인덱스의 값을 변경하려면 myNumber[3] = 200; // 으로 할당을 주면 myNumber; // 배열의 내용이 바뀐다 [73, 98, 86, 200, 95].. 더보기
5. 반복문 반복문은 같거나 비슷한 코드를 여러 번 실행시켜야할 때 사용함. let sum = 1; //"sum과 숫자의 합"을 "sum에 대입"하자 sum = sum + 2; //조건1: 숫자(n)은 2부터 시작하고 sum = sum + 3; //조건3: 숫자(n)은 1씩 증가한다 sum = sum + 4; //조건2: 숫자(n)이 4가 될 때까지 반복하고 console.log(sum); 위의 코드를 직접 다 쓰지 않고 반복문을 이용해 보다 간결하게 작성해봅시다. 1. 먼저 위의 조건들을 코드로 써봅니다. sum = sum + n; // "sum과 숫자(n)의 합"을 "sum에 대입"하자 let n = 2; // 조건1 = 초기화: 숫자(n)은 2부터 시작하고 n 더보기

티스토리툴바