반응형

(Recub) function 을 호출하는 법

오늘의 퀘스트

very nice 한 나이 계산기 만들기.! (prompt()_를 사용하여)

*prompt는 사용자에게 메시지를 보여주고 값을 넣으라고 말한다.

 

 

 

const age = prompt("How old are you?"); //massame는 string, 이 상태에서 값을 기다린다. 잘 안씀 css를 적용시킬수도 없음. 

//console.log(age); 대신에
console.log(typeof "15" typeof parseInt("15")); //이렇게 작성해야한다. string이 기본값.

//JaveScript를 일시정지시킴,브라우저로 할 수 있는 가장 직접적인 방법.cancle 을 누르면 null값을 리턴.

//console에 출력된 값은, num type 이 아니라  str type 이다. 

type을 변경해보자 str에서 num 으로,,
parseInt 을 사용한다..
const age = parseInt(prompt("How old are you?"));


if (isNaN(age)) {
    console.log("Pleas write a number");
} else {
    console.log("Thank you for writing your age.");
}

 

'Developer' 카테고리의 다른 글

The document object  (0) 2021.12.28
Contiditonals part Three..  (0) 2021.12.27
조건문 (conditionals) if-else  (0) 2021.12.27
조건문 (conditionals) if-else  (0) 2021.12.27
#바닐라_자바스크립트_7  (0) 2021.12.27
반응형

(Recub) function 을 호출하는 법

오늘의 퀘스트

very nice 한 나이 계산기 만들기.! (prompt()_를 사용하여)

*prompt는 사용자에게 메시지를 보여주고 값을 넣으라고 말한다.

 

 

 

const age = prompt("How old are you?"); //massame는 string, 이 상태에서 값을 기다린다. 잘 안씀 css를 적용시킬수도 없음. 

//console.log(age); 대신에
console.log(typeof "15" typeof parseInt("15")); //이렇게 작성해야한다. string이 기본값.

//JaveScript를 일시정지시킴,브라우저로 할 수 있는 가장 직접적인 방법.cancle 을 누르면 null값을 리턴.

//console에 출력된 값은, num type 이 아니라  str type 이다. 

type을 변경해보자 str에서 num 으로,,
parseInt 을 사용한다..
const age = parseInt(prompt("How old are you?"));


if (isNaN(age)) {
    console.log("Pleas write a number");
} else {
    console.log("Thank you for writing your age.");
}

 

'Developer' 카테고리의 다른 글

Contiditonals part Three..  (0) 2021.12.27
조건문 (conditionals) if-else  (0) 2021.12.27
조건문 (conditionals) if-else  (0) 2021.12.27
#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_7  (0) 2021.12.27
반응형

(Recub) function 을 호출하는 법

오늘의 퀘스트

very nice 한 나이 계산기 만들기.! (prompt()_를 사용하여)

*prompt는 사용자에게 메시지를 보여주고 값을 넣으라고 말한다.

 

 

 

const age = prompt("How old are you?"); //massame는 string, 이 상태에서 값을 기다린다. 잘 안씀 css를 적용시킬수도 없음. 

//console.log(age); 대신에
console.log(typeof "15" typeof parseInt("15")); //이렇게 작성해야한다. string이 기본값.

//JaveScript를 일시정지시킴,브라우저로 할 수 있는 가장 직접적인 방법.cancle 을 누르면 null값을 리턴.

//console에 출력된 값은, num type 이 아니라  str type 이다. 

type을 변경해보자 str에서 num 으로,,
parseInt 을 사용한다..
const age = parseInt(prompt("How old are you?"));


if (isNaN(age)) {
    console.log("Pleas write a number");
} else {
    console.log("Thank you for writing your age.");
}

 

'Developer' 카테고리의 다른 글

조건문 (conditionals) if-else  (0) 2021.12.27
조건문 (conditionals) if-else  (0) 2021.12.27
#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_6  (0) 2021.12.27
반응형

만약 내가 망고주스를 만들고 싶은데,

주스 기계에서 망고주스가 안 꺼내진다면?(undefined)

 

집에 믹서가 있다.

나는 주스를 만들고 싶은 상황이다.

만들어진 주스를 꺼내야 한다.

console.log()를 함수 안에서 쓰면, 안꺼내지는 것과 같은 상황이다

 

그래서 console.log 대신에 return 을 사용해서, variable에 function을 할당해서 꺼내주는 거다.

 

variavle은 function의 return value를 가지게 된다. 

calculator.plus가 5를 return 하면 plusResult는 5가 된다. 

 

 

 

 

 

 

const calculator = {
    plus: function (a,b) {
      return a+b;
    },
    minus: function (a,b) {
      return a-b;
    },
    divide: function (a,b) {
      return a/b;
    },
    powerof: function (a,b) {
      return a**b;
    },
  };

  const plusResult = calculator.plus(2,3);
  const minusResult = calculator.minus(plusResult,10);
  const timesResult = calculator.times(10,minusResult);
  const divideResult = calculator.divide(timesResult,plusResult);
  const powerResult = calculator.powerof(divideResult,minusResult);

콘솔에서는 아무일도 벌어지지 않지만 

>에 입력을 하면 값이 출력된다. 

짜잔..

 

마..마지막으로 니꼬가 한 번 더 복습하쟤..

plus function  은 a와 b라는 변수를 받고있다. 

 

const plusResult = calculator.plus(2,3);

a = 2, b = 3 이 대입된다.

이 funtion은 a+b, 즉 2+3을 return한다. 

 

위의 fuction을 호출하는 코드가 그 funtion의 반환 값이 된다. 

즉, return값은 5가 된다.

 

function내부에서 console.log()하는 것과 큰 차이가 있다.

function의 외부에서 값을 얻은 뒤에, 그 값으로 내가 원하는 모든 것을 할 수 있다.

 

<<결론>>

 

콘솔에서 값을 도출할 수 있게 된다 

위의 코드들은 상호의존적이다. 

 

 

 

 

 

 

 

'Developer' 카테고리의 다른 글

조건문 (conditionals) if-else  (0) 2021.12.27
#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_6  (0) 2021.12.27
#바닐라_자바스크립트_4  (0) 2021.12.26
#바닐라_자바스크립트_3  (0) 2021.12.26
반응형

object를 추가,업데이트 _2

const player = {
    name: "aeong",
    points: 10,
    fat: true,
};

인 상황에서,  

player에  15점을 추가해서 업데이트 하고 싶을 때 

->

 

console.log(player);
player.points = player.points + 15;
console.log(player.points);
player.points = player.points + 15;

 


Q : 우리가 넘겨주는 어떠한 이름이든, Hello를 해주는 function을 작성해보자

(1) function이 없는 세상 버전

= console.log("Hello my name is Nico";

console.log("Hello my name is Nico";
console.log("Hello my name is Nico";
console.log("Hello my name is Nico";
console.log("Hello my name is Nico";
console.log("Hello my name is Nico";
dl

이름 자리에 이름만 바뀌고 오지게 중복되는 코드를 작성하게 된다. 

 

(2) function 이 있는 세상

*function은 어떤 코들를 캡슐화해서, 실행을 여러 번 할 수 있게 해준다.

*규칙 .()를 사용해야 한다. 실행하게 될 코드블록이 필요하다. {} 안에 작성하는 것이 . 

 sayHello 를 실행할 때마다 실행되는 거다.

 

function sayHello(){

    console.log("Hello!");           // array.push (), alert()

}

() 이 괄호표시가 펑션의  플레이버튼이다. 

sayHello();

sayHello();

sayHello();

sayHello();

이렇게 작성하면, 

Hello!

Hello!

Hello!

Hello!

이렇게 출력됨. 

 

"Hello my name is C" 를 출력하려면??
*argument, : function 을 실행하는 동안 어떤 정보를 function  에게 보낼 수 있는 방법

 

function sayHello(nameofPerson,age) {//2개의  argyment를 받고있다.
    console.log("Hello my name is"+nameofPerson+" and I',"+age)
}


sayHello("nico",10);
sayHello(" dag",23);
sayHello("lynn",21);
//v의 자리에  nico가 들어갔음 좋겠다고 생각하는거지 지금.. how to receive

 

'Developer' 카테고리의 다른 글

#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_6  (0) 2021.12.27
#바닐라_자바스크립트_3  (0) 2021.12.26
#바닐라_자바스크립트_2  (0) 2021.12.24
#바닐라 자바스크립트_1  (0) 2021.12.24
반응형

#Basic Data Types

 

null;  = there is nothing

diffrent with false;

nothing variable / undifined 

false is defined 

 

null은 valriable 안에 어떤 값도 없다는것을 확인시키기 위해 존재한다. 

somthing은 undefined 를 의미.

 

const

console.log()

console.push

[ ,]0 array

 

object가 필요한 이유는 무엇인가?

 arry안에, 요소만으로는 특징을 표현하기 어려우니까. 

* 중괄호 안의 규칙은 중괄호 바깥의 규칙과 다르다

1. object안에서는  =  를 사용하지 않는다. 대신 : 를 사용한다.

한개의 priterty 작성 뒤에, 콤마를 찍고 또 작성 가능. .. 

2. console.log(player);

console.log(player.name):

프로토타입이. object라고 나온다. 

다양한 값을 가질 수 있다. 

 

 

그러나 리스트는 모든 값이 같은 의미를 가진다. 

(태그처럼 생각하면 됨)

 

console.log(player["name"]);

console.log(player);

player.fat = false;

console.log(player);

 

-> 저번에 배운 바에 의하면, const 의 값은 바꿀 수 없다. '

그러나 저장하고 브라우저에서 확인하면 값이  true에서 false로 바뀐 것을 볼 수 있다. 

 

왜일까?? 여기서 하는 것은 object 안의 무언가를 바꾼 것이기 때문이다. 

근본적인 값은 바뀌지 않지만, 그것을 이용한 복제본을 마음대로 찜쪄먹는다고 생각하면 쉽다. 

 

어떤 property 도  object를 사용하면 만들 수 있다. (.)

 

 

 

 

 

 

object 

 

'Developer' 카테고리의 다른 글

#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_6  (0) 2021.12.27
#바닐라_자바스크립트_4  (0) 2021.12.26
#바닐라_자바스크립트_2  (0) 2021.12.24
#바닐라 자바스크립트_1  (0) 2021.12.24
반응형
자바스크립트를 사용하는 이유

 

3D 모델링하기에 최적화된 언어이다. 
프레임워크를 사용해서 
리액트 네이티브 _ 안드로이드, ios, 일렉트론 ,  자스,  HTML/CSS , 슬랙... 기타등등
앱을 만들수있다.
심지어 백엔드도 돌릴수있다고 한다. 

 

기절할것같네, 정말 파워풀하다. 개발자들 극락간다

 

더보기
*socket.io 라는걸로 채팅도 가능하게 만든다.
 ml5  를 이용하여
머신러닝 모델을 생성하는 웹사이트를 구축해서 그 모델을 훈련시킬 수 있다 

 

 

#메타태그 아래 작성

<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css"

#자바스크립트는 HTML의  body 태그 아래에 script 로 작성

<script src="app.js"></script>
 
 
 
 

#콘솔은 항상 열어둬서 새로고침 확인할수 있게 한다. 

'Developer' 카테고리의 다른 글

#바닐라_자바스크립트_7  (0) 2021.12.27
#바닐라_자바스크립트_6  (0) 2021.12.27
#바닐라_자바스크립트_4  (0) 2021.12.26
#바닐라_자바스크립트_3  (0) 2021.12.26
#바닐라 자바스크립트_1  (0) 2021.12.24

+ Recent posts