김숭늉 마음대로

Udemy section 11 (32일) - 연습시간, 메서드 본문

IT/웹개발 (100일 도전)

Udemy section 11 (32일) - 연습시간, 메서드

김숭늉이 2023. 3. 10. 22:03
728x90
1) 연습시간!!
 
 
let onlineCourse = {
    name: 'Web Development - The Complete Guide',
    price: coursePrice,
    goals: ['Learn Web Development', 'Become a web developer', 'Have fun!'],
}

alert(onlineCourse.price);
alert(onlineCourse.goals[1]);
 

function  getListItem(array,arrayIndex) {
    let arrayElement = array[arrayIndex];
    return arrayElement;
}
let firstGoal = getListItem(onlineCourse.goals,[1]);

 

 

2) 메서드 (method)

     객체 안의 함수를 메서드라고 한다! (기능적으로는 함수임!)

 

let person = {
  name : 'Max', // Property 속성
  greet(){     //Method
    alert('Hello');
  }
}

person.greet()

   ㄴ greet () 함수는 매개변수도 없고, 아무값도 반환하지 않는 함수!

 

 

3) console.log  => 브라우저 내장 매서드!

totalAdultYears = calculateAdultyears(age);
console.log(totalAdultYears);

 

4) (...data:any [] ) -> 어떤 매개변수든 받음

   void : 아무런 값도 반환하지 않음을 의미

 

5) 수학 연산!  소수와 정수!

 

//Math Operations

console.log(10 + 4);
console.log(10 - 4);
console.log(10 * 4);   // integer numbers (정수) or simply integers
console.log(10 / 4);   // 2.5를 출력함 (소수점이 있는건) floating point number or floats

 

6. 모듈러스 연산자

console.log(10 % 4);  // 2를 출력함 (나머지 연산의 결과) 모듈러스 연산자라고 함

 

6. 수학연산, 수학규칙 

 

곱하기와 나누기가 먼저 적용되고 덧셈과 뺼셈은 나중에 계산됨!

먼저 계산되어야하는 부분에 괄호 적용! (일반적인 수학 연산의 규칙을 따름!

 

let result = (10 + 3 - 5) * 10;
result = 10 * 4;

result = result + 1
result++; // result = result + 1
result--; // result = result - 1

result += 5; //result = result + 5
result -= 5; //result = result - 5
result /= 5; //result = result / 5
result *= 5; //result = result * 5

   -> 연산 축약 표기법

 

 

7. 문자열(텍스트) 작업 수행 

console.log('Seungyeon' +' '+ 'Kim'); // Seungyeon KIM 출력
 
 
8. 자바 스크립트 연산자, 약식 연산자 & 값 유형 [32일차]

다음은 해당 섹션의 끝에 도달한 후 바로 지금 또는 나중에 검토할 수 있는 "심층 정보" 추가 읽기입니다. 연산자, 값 그리고 값 유형에 대한 더 유용한 정보입니다. 또한 PDF로 첨부되어 있습니다.

연산자에 대한 추가 정보

이전 강의에서 우리는 자바 스크립트로 수학을 할 때 항상 사용하게 될 핵심 연산자를 살펴보았습니다.

 +: 두 개의 숫자를 더하거나 두 개의 문자열을 연결

 -: 두 숫자 빼기

 *: 여러 개의 두 숫자

 /: 두 숫자를 나눕니다.

 %: 나눗셈의 나머지를 구합니다.

 

영상에서는 다루지 않았지만 과정 후반부에 표시될 유용한 속기 연산자도 있습니다.

 ++(예: age++): age = age + 1에 대한 약식 표기법(변수에 저장된 값을 1씩 증가시키고 해당 변수에 다시 저장)

 --(예: age--): age = age - 1에 대한 약식 표기법(변수에 저장된 값을 1만큼 감소시키고 해당 변수에 다시 저장)

 ** (예: age = 4 ** 3): 지수 연산자(예: age = 4 * 4 * 4 대체)

 +=(예: age += 2): age = age + 2에 대한 약식 표기법(변수에 저장된 값을 증가시키고 해당 변수에 다시 저장)

 -= (예: age -= 2): age = age - 2에 대한 약식 표기법(변수에 저장된 값을 감소시키고 해당 변수에 다시 저장)

 *= (예: age *= 2): age = age * 2에 대한 약식 표기법(변수에 저장된 값을 곱하여 해당 변수에 다시 저장)

 /= (예: age /= 2): age = age / 2에 대한 약식 표기법(변수에 저장된 값을 나누어 해당 변수에 다시 저장)

 

값 유형에 대한 추가 정보

모든 값에는 특정 값 유형이 있다는 것을 이해하고 염두에 두는 것도 중요합니다. 예를 들어 2는 숫자이고 'hi'또는 '2'는 문자열입니다('!에 주의).

특히 '2'의 경우가 중요합니다. 우리 인간에게는 숫자처럼 보이지만 물론 엄밀히 따지면 숫자입니다. 그러나 "원시 숫자"가 아닌 텍스트로 저장됩니다.

그게 왜 중요할까요?

위에서 언급한 연산자로 작업을 수행하기 시작하면 중요합니다. 다음은 몇 가지 예제 코드 조각과 이에 의해 생성되는 결과입니다(브라우저 개발자 도구의 자바 스크립트 콘솔에서 모두 테스트할 수 있음).

  1. let a = 'hi' + ' there'; // 'hi there' => a string
  2. let b = 'the number' + ' 2'; // 'the number 2' => a string
  3. let c = 'the number' + 2; // 'the number2' => a string
  4. let d = 2 + 2; // 4 => a number
  5. let e = 2 + '2'; // '22' => a string! (i.e. the number 2 is treated like a string '2' here)
  6. let f = '2' + '2'; // '22' => a string! ('2' and '2' concatenated)
  7. let g = '2' * 3; // 6 => a number

위의 예를 살펴보면 생성한 결과를 생성할 것으로 예상하지 못한 일부 코드 라인이 있을 수 있습니다.

특히 e, f와 g는 혼동될 수 있습니다.

그러나 값에는 특정 값 유형이 있다는 점을 염두에 두면 덜 혼란스럽습니다. 무언가를 따옴표로 묶는 경우(큰따옴표든 작은따옴표든 중요하지 않음) 문자열입니다. 비록 그것이 우리에게 숫자처럼 보일지라도 문자열에 + 연산자를 사용하면(다른 값이 숫자인 경우에도) 자바 스크립트는 문자열에 대해 +를 사용할 때 항상 하던 일을 수행하죠.

값을 연결해서 새로운 문자열을 만듭니다. 이것이 e와 f가 결과로 '22'를 산출하는 이유입니다.

이제 결과가 갑자기 문자열이 아니라 숫자이기 때문에 g가 다시 혼란스러울 수 있지만 그 이유는 간단합니다. 자바 스크립트는 문자열에 대해 *, / 또는 -로 무엇을 해야 할지 모릅니다. 하지만 바로 실패하는 대신 문자열을 배후에서 숫자로 변환하고 변환된 숫자를 연산에서 대신 사용하려고 시도합니다. 그래서 결과적으로 숫자 6을 얻습니다.

문자열을 숫자로 변환하는 데 실패하면(예: 'hi' * 3을 시도했기 때문에) "Not a Number"를 나타내는 NaN이라는 특별한 결과를 얻게 됩니다. 이와 같은 경우에 자바 스크립트에 존재하는 특수 값입니다.

다른 값 유형(객체, 배열, 함수 등)도 있지만 지금은 숫자와 문자열이 가장 중요하며 과정을 통해 더 많은 값과 값 유형을 탐색할 것입니다!

 

 

 

9. 문자열 연산 & 문자열 매서드 

 

let userName = 'Max';

console.log(userName.length);

 

let userName = 'Max';

console.log(userName.toUpperCase());   // 대문자로 바꿈

 

728x90
반응형