🦎 JavaScript 62

[JS] 개체(Objects)

개체(Objects) 또 다른 데이터 구조이다. 배열을 데이터 구조로 사용해왔다. 배열은 같은 변수에 다수의 관련 값을 저장하기 위해서이다. const jonasArray = [ "Jonas", //이름 "Schmedtmann", //성 2037 - 1991, //나이 "teacher", //직업 [("Michael", "Peter", "Steve")], //배열안에 배열 ]; [("Michael", "Peter", "Steve")] ← 배열안에 배열이 있다. 여러 값을 결합한 데이터 구조이다. 배열에서는 이 요소들에 이름을 줄 방법이 없다. 그래서 이름으로 참조가 안되고 배열에 있는 주문 번호로만 참조할 수 있다. 그 문제를 해결하기 위해서는?? 그래서 개체가 있는 것이다. (놀랍도다..) ● 개체에서..

🦎 JavaScript 2023.02.27

[JS] 배열 매서드(Array methods)

배열 매서드(Array methods) → 연산이라고 생각하면 쉽다. Js에서 기본 제공 함수들이 있는데 기본적으로 배열에 직접 적용할 수 있다. 그것들을 배열 매서드라고 부른다. const friends = ["Michael", "Steve", "Peter"]; push push 매서드는 배열의 끝에 요소들을 추가한다. const friends = ["Michael", "Steve", "Peter"]; friends.push("Jay"); 친구를 입력하고 .push를 하면 배열 끝에 요소들을 추가한다. push는 본질적으로 함수이다. 옆에 괄호가 있다. 괄호는 우리가 호출하는 함수이다. push앞에 있는 .은 friends배열 자체에 연결되는 함수인걸 의미한다. ● push는 메서드이다. ● 기술적으로..

🦎 JavaScript 2023.02.27

[JS] 배열(Array)

데이터 구조 → array(배열) const friend1 = "Michael"; const friend2 = "Steve"; const friend3 = "Peter"; 친구 3명을 적기 위해 변수를 3번 적었다. 만일 친구 10명을 적기 원하면 변수를 총 10변을 적어야 할까? 그렇다. 그렇다면 이것을 더욱 간단하게 할 수 없을까? 간단하게 작성할 수 있다. 어떻게? 이 모든 값을 한데 묶어서 더 큰 컨테이너에 넣는것이다. 위와 같은 과정을 하기 위해 JS에는 데이터 구조가 있는 거다. Array(배열)은 데이터 구조이다. Array는 큰 컨테이너같다. 거기에 변수를 입력했다가 나중에 참조할 수 있다. 과연 중요할까? 중요하다. 프로그래밍은 대부분의 시간 데이터 위주이니까 저장하고 처리하는 어딘가에서..

🦎 JavaScript 2023.02.22

[JS] 중첩 함수(Nested Function)

function fruitProcessor(apples, oranges) { console.log(apples, oranges); const juice = `juice with ${apples} apples and ${oranges} oranges.`; return juice; } 일정한 개수의 사과와 오렌지를 받아 그걸 바탕으로 주스를 생성하고 값을 반환했다. 중첩 함수 함수안에서 다른 함수 호출해보기 그러나 이번에는 frunitProcessor를 통해 작은 과일 조각만으로 주스를 만들 수 있는 시나리오로 해보겠다. function cutFruitPieces(fruit) { return fruit * 4; } 과일주스를 만들기 전 다른 기계가 필요하다. 1. function cutFruitPieces(..

🦎 JavaScript 2023.02.13

[JS] 화살표 함수(Arrow Function)

화살표 함수(arrow function) 특별한 형태의 함수 표현으로 더 짧고, 더 빠르게 사용 가능 //arrow function birthYear => 2037 - birthYear; 나이를 계산해야 함으로 birthYear이 필요하다. birthYear을 작성 후 => 화살표를 작성한다. 그래서 화살표함수인거다 ㅋㅋ! 그다음 반환하고 싶은걸 적으면 된다. 2037 - birthYear 을 작성했다. 이러면 끝이다. 근데 막상 혼자서 해보면 어렵다. 이 함수를 사용하고 싶다. 그러면 어떻게 해야하는가? 변.수.저.장을 해야한다. //arrow function const calcAge3 = birthYear => 2037 - birthYear; const calcAge3로 이 함수에 해당 변수를 설정했..

🦎 JavaScript 2023.02.11

[JS] 함수 선언(Function Declarations) | 함수 표현식(Function Expression)

JS에서 함수를 작성하는 방법은 여러가지이다. 각각의 기능은 조금씩 다르긴하다. 함수 선언 https://recordoftheday.tistory.com/entry/JS-%EC%84%A0%EC%96%B8%EA%B3%BC-%ED%91%9C%ED%98%84 [JS] 함수(Functions) JS 앱의 기본 구성요소는 함수이다. 또한 언어에서 가장 필수적인 개념 중 하나이다. 함수란 무엇일까? 함수는 코드의 일부로 우리 코드에서 재사용할 수 있다. (코드를 반복해서 작성하는 비효 recordoftheday.tistory.com ↑ 함수에 대해 정리 해논 내용은 함수 선언(function declarations)이다. 함수 키워드만으로 함수를 선언했기 때문이다. 출생 년도에 따라 나이를 계산하는 기능이다. fu..

🦎 JavaScript 2023.02.08

[JS] 함수(Functions)

JS 앱의 기본 구성요소는 함수이다. 또한 언어에서 가장 필수적인 개념 중 하나이다. 함수란 무엇일까? 함수는 코드의 일부로 우리 코드에서 재사용할 수 있다. (코드를 반복해서 작성하는 비효율 ↓ ) 변수와 비슷하지만 코드 덩어리 전체를 위한 것이다. → 작업의 묶음 따라서 변수는 값을 갖고 있지만 함수는 코드 한줄 이상을 갖는다. 프로그래밍 언언의 함수도 입력을 받아서 출력을 내보낸다. 이때 함수 내부로 입력을 전달받는 변수 → 매개변수(parameter) 입력 → 인수(argument) 출력 → 반환값(return value) 라고 한다. 매개변수 ● 함수를 선언할 때 외부에서 값을 받는 변수 ● 함수 이름 옆의 괄호 안에 매개변수 이름을 넣어준다. ● 매개변수에 이름을 붙이는 방법은 일반적인 변수 ..

🦎 JavaScript 2023.02.07

[JS] 특수모드(엄격모드)

JS에서 특수 모드(special mode)를 활성화해야한다. 특수 모드(special mode) = 엄격모드(strict mode) JS에서 활성화할 수 있고 보안 JS 코드를 더 쉽게 만들 수 있다. 엄격 모드를 활성화하기 위해 해야할 일은 스크립트 시작 부분에 'use strict'를 작성하는 것이다. "use strict"; 엄격하게 사용하면 된다. 그래서 전체 스크립트에 대해 엄격모드를 활성화했다. 이 문장은 기본적으로 스크립트의 첫 번째 문장이어야 한다. 따라서 이 전 코드가 있으면 엄격 모드는 활성화되지 않는다. comments는 허용된다. 왜냐하면 JS는 코드 없이 무시한다. 활성화된 엄격 모드는 특정 기능 또는 특정 블록에만 해당한다. 스크립트 시작부분에 엄격모드를 작성하면 더 안전한 코..

🦎 JavaScript 2023.02.05

[JS] 조건(삼항) 연산자

조건(삼항) 연산자 if/else문과 switch문 말고 다른 것 하나가 더 있다. 바로 조건 연산자(conditional operator)이다. 조건 연산자는 if/else문과 유사한 것을 작성하려고 하지만 모두 한 줄에 있어야한다. const age = 23; age >= 19 ? console.log("I like to drink water"): console.log("I like to drink milk"); age >= 19 ← 나이가 맞는지 확인하는 테스트, 이 조건이 끝나면 뒤에 ?(물음표)를 붙여준다. 그리고 if 블록을 작성해준다. if블록은 내가 실행하고자 하는 코드이다. age >= 19 이 ? console.log("I like to drink water") ← 블록이 끝나면 :을 ..

🦎 JavaScript 2023.02.02
728x90