코딩/위코드 코딩학습

[위코드] TIL(Today I am learned) -04

카슈밀 2020. 6. 26. 01:28
반응형

뭔가 코딩을 배우는건지 그냥 코딩학습 자료를 베껴오는데 혈안이 된건지 구분이 안되서

그냥 간단히 내용을 정리하고 나의 생각등을 정리하는데로 방향을 잡아야겠다고 생각되었습니다.

다른 분 웹로그에 정리한 것을 보니 엄청 잘해놓으신 게 있길래 가급적 그런 스타일로 작성하도록 노력하겠습니다

 

텍스트 문자열의 연결

alert를 치면 알람이 출력된다.

"안녕하세요 김모씨"라고 출력했었다,.

하지만 이를 바꿀 수 도 있다.

 

var username = "김모씨";

alert(username);

 

var message = "안녕, ";

var username = "김모씨"

var hello = message + username;

console.log(hello);

 

그러면 이제 자동으로 출력으로 "안녕, 김모씨"로 출력된다.

이렇게 자동으로 변경하여 출력 변수만 설정해준다면 로직이 알아서 결과물이 나오는 것이다.

 

다음은

텍스트 + 숫자조합이다.

 

console.log( "22")는 출력되는 것은 숫자일까 문자일까?

컴퓨터에서는 숫자가 아니라 ""(쌍따옴표) 안에 있으면 문자로 인식한다.

숫자에서 연산자를 쓰려면 꼭 숫자만 표기하도록 하자.

 

num+sting의 병행 사용이다.

이때 단점은 

num을 사용할지라도 string형으로 바뀌어서 표기된다.

alert("1더하기 1은" +1+1);

로 작성시에 "1더하기 1은 11"로 출력될것이다.

왜냐하면 그냥 string으로 변환되서 출력되었으므로...

개발자들은 말하기도 한다. 자바스크립트는 다른 언어와 다르게 num+string을 적용시 에러를 발생하지 않고

그냥 출력하기 때문에 자신이 생각과 다르게 출력이 가능함에 따라 불편함을 호소하기도 한다고 한다.

 


if문

if문은 너가 만약 ~ 한다면 ~한다라는 구문을 컴퓨터 용어로 만들어 놓은 것입니다.

그렇다면 if문의 형태를 보도록 하겠습니다.

if(answer ==="비밀") {

 alert("맞았다!");

 alert("축하해!");

}

위에 if문의 형태는 만약 사용자가 "비밀"이라는 답변을 하면

"맞았다!", "축하해!"라는 문구가 출력될겁니다.

 

그렇다면 이제 답변을 잘못친 경우도 있겠죠?

그럴 경우엔 어떻게 해야하는지 알아보도록 합시다.

if(answer ==="비밀") {

 alert("맞았다!");

 alert("축하해!");

} else if("진실") {

 alert("틀렸다")

}

이젠 "진실"을 치면 "틀렸다"라는 문구가 출력될 것입니다.

참 쉽죠?

틀렸을 경우의 여러가지의 결과에 대한 변수를 작성해두면 간단하게 모든 것을 해결할 수 있습니다.

*이때 중요한 것이 일단 alert의 순서대로 변수의 값과 일치하는지 확인하고 내려오기때문에

꼭 이에 맞춰서 작성하도록 하자.

 

중첩구문이 있으면 어려워질 수 있다.

필자는 이를 해결하는데, 3시간 이상헤맸다.

function myHappy(color) {

 if (color == '행복') {

  return '진실';

 } else if (color == '웃음') {

  return '거짓';

 } else if (color) {
  return '다시 알아봐';

 }

3가지 매개변수의 변환과 리턴을 주었다.

조건

1. 행복 값을 주고 일치했을 때, 리턴 값으로 진실을 주자.

2. 웃음 값을 주고 일치했을 때. 리턴 값으로 거짓을 주자

3. 그마저도 아닌 다른 것일때, 리턴 값으로 다시알아봐 주자.

 

흔히 초보 개발자들이 실수하는 것으로 여기까지가 다 만든 것으로 아는데,

이제 다 만든 것이 아니다.

여기까지가 로직을 짠 것이고, 실행을 시켜보자.

 

myHappy('사랑');

반환 값으로 '진실'을 출력할 것이다.

이렇게 함수호출을 해야 이제 작동될 것이다.

꼭 이부분을 까먹지 말자.!

 

비교 연산자

== 

=== 

이것의 차이를 아는가? 

"3" 이것과 3의 차이는?

답은 "3"은 문자열(string), 3은 3자라는 의미이다.

"3"==3 은 참일까? 거짓일까?

"3"===3 은 참일까 거짓일까?

 

== 2개의 짜리 연산자의 답은 '참'

=== 3개 짜리 연산자의 답은 '거짓'

왜냐하면, '=='는 느슨한 연산자이고, '==='는 엄격하기때문이다.

"3"==3은 문자열과 숫자가 다르지만 표기가 같기에 '참'을 출력한 것이고

"3"===3은 문자열과 숫자가 다르기때문에 '거짓'을 출력한 것이다.

 

>=(이상) <=(이하)의 표기가 있고, 다른 것들 일반적으로 우리가 보던 연산자들이라

가볍게 알아두고 머리에 집어넣도록 하자.

 

물론 부정 연산자도 있다.

!(느낌표)를 붙이면 부정의 의미로 쓸수도 있다.

!== 같지 않음.으로 사용된다.

>= 좌변이 (우변보다) 크거나 같다.
<= 좌변이 작거나 같다.
> 좌변이 크다.
< 좌변이 작다.
== 서로 같다.
!== 서로 다르다.

 

논리연산자.

조건만 다르고, 동일한 값을 출력해야 하는 경우가 있다. 

그럴 경우에는 어떻게 조건을 주는가? 보통 and, or를 현실에서 사용할 것이다.

자바스크립트도 동일한 연산자가 있다.

or은 "||"로 표기(\+shift)

and은 "&&"로 표기

2개를 꼭 써야한다. 1개만 표기하면 작동하지 않는다.

 

앞서 숫자이야기 할때 ()괄호를 썼다. 그 이유가 내가 생각한 것과 컴퓨터가 연산 처리 순서가 다르기때문이다.

그래서 논리연산자도 ()괄호를 쓴다.
왜냐하면 컴퓨터는 좌측부터 해당 내용을 읽기때문에 다중조건에서 내용이 달라지지 않도록 미리 적용해야 할 필요가 있는 것이다.

 


 

Function(함수) - 데이터 받기

함수의 정의 및 실행.


배열은 []대괄호로 감싸짐.

배열에서 element는 var 변수 = ['삼성', 'lg'] 에서 삼성, lg를 의미한다.

배열의 요소는 순서를 갖고 있으며, 순서의 순번은 0, 1, 2, 3으로 시작한다.

 

 

일단 뭔가 이해가 안되는 듯 싶어서 여기까지 작성하고 다시 복습하러 갑니다.

728x90