자바스크립트 선행

hyocho·2022년 9월 21일
1

JavaScript

목록 보기
10/18

📌표기법

- dash-case(kebab-case)

단어와 단어 사이를 '-'를 이용하여 연결
html과 css에서 주로 사용

- snake_Case

단어와 단어 사이에 언더바를 사용하여 연결
html과 css에서 주로 사용

- camelCase

첫글자는 소문자, 그 다음부터 오는 단어들은 대문자로
js에서 사용

- PascalCase

첫글자부터 모두 대문자로 표기
js에서 사용

- zero-based Numbering

0기반 번호 매기기. 특수한 경우를 제외하고 0부터 숫자를 시작한다.

- 주석

ctrl + /

//한 줄 메모
/* 한 줄 메모*/

/**
 *여러 줄
 * 메모 1
 * 메모 2
 */

📌데이터 종류(자료형)

- String

문자 데이터. 따옴표를 사용한다.

- Number

숫자 데이터. 정수 및 부동소수점 숫자를 나타낸다.

- Boolean

true, false 두가지 값밖에 없는 논리 데이터.

- Undefined

값이 할당되지 않은 상태를 나타낸다. 값이 없다.

- Null

어떤 값이 의도적으로 비어있음 을 의미한다.

- Object

객체 데이터. 여러 데이터를 {Key:Value} 형태로 저장된 데이터들의 집합.

- Array(배열 데이터)

[여러 데이터] 를 순차적으로 저장한다.


📌변수

  • 데이터를 저장하고 참조(사용)하는 데이터의 이름
  • 재사용이 가능하다.
  • 값(데이터)의 재할당
    • const : 재할당 불가능
    • let : 재할당 가능

예약어
특별한 의미를 가지고 있어, 변수나 함수 이름 등으로 사용할 수 없는 단어
ex) this, if, break...


📌함수 (function)

  • 특정 동작(기능)을 수행하는 일부 코드의 집합
  • 값을 반환할 때는 return 을 사용.
// 매개 변수를 갖는 함수

function sum(a, b) {
  // x, y는 매개변수(Parameters)
  return (a + b);
}

let x = sum(1, 2); // 1과 2은 인수(Arguments)
  • 함수선언을 할 때 호출되는 부분에서 데이터를 집어넣을 수 있고,
    집어넣은 데이터를 받아준 변수라는 것을 소괄호 사이에 정의할 수 있다.
    함수 안에서 사용하는 데이터를 받아주는 매개체가 되는 변수라고해서 매개변수라고 하고,
    매개변수가 받아줄 특정한 데이터들을 인수라고 한다.
// 기명 함수
// 함수 선언
function hello(){
 console.log('hello');
}

// 익명 함수. 데이터로서 활용. 변수에 할당하여 사용
// 함수 표현. 함수의 이름이 없으면 함수를 표현한다고 한다
let world = function (){
  console.log('world');
}
  • 선언과 표현의 차이
  • 객체 데이터 내부에 속성 부분에 함수가 할당되어져 있으면 메소드라고 부른다.

📌조건문

조건의 결과에 따라 다른 코드를 실행하는 구문
if, else 를 사용하여 구문을 작성할 수 있다.

if (조건) {
  내용;
}

괄호 안의 조건이 true이면 실행한다.


📌DOM API

자바스크립트에서 HTML을 다루는 명령들.
✅defer : 가져온 JS파일을 HTML 문서 분석 이후에 실행하도록 지시하는 HTML 속성


📌메소드 체이닝

method chaining
메소드를 체인처럼 연결해서 사용하는 방법.
분리해서 사용하면 코드가 길어지기 때문에, 짧게 작성하기 위하여 사용하는 방법.

const a = 'Hello~';

//split : 문자를 인수 기준으로 쪼개서 배열로 반환
//reverse : 배열을 뒤집기
//join : 배열을 인수 기준으로 문자로 병합해 
const b = a.split('').reverse().join(''); // 메소드 체이닝

console.log(a); //Hello~
console.log(b); //~olleH
profile
기록하는 습관을 기르고 있습니다.

0개의 댓글