본문 바로가기
웹 프로그래밍(풀스택-->python)

11. 자바스크립트 맛보기

by 백엔드개발자0107 2021. 4. 1.

내 생각 : 내가 공부하는 사이트에서 자바스크립트에 대한 개념설명을 아래와 같이 해놓았다.


  • 프로그래밍 언어 중 하나로, 브라우저가 알아들을 수 있는 언어입니다.[잠깐 상식!]A. 불가능한 이야기는 아닙니다. 다만, 이 "역사적인 이유 & 이미 만들어진 표준"이기 때문에, 모든 브라우저는 기본적으로 Javascript를 알아듣게 설계되어있고, 모든 웹서버는 HTML+CSS+Javascript를 주게 되어있죠.
  • Q. 왜 브라우저는 Javascript만 알아들어요? HTML안에다 파이썬, Java 같은 언어를 써서 주면 안되나요?
  • 이론 설명 때, 클라이언트가 서버에 요청하면, 서버가 클라이언트에게 HTML+CSS+Javascript를 준다고 했던 것, 기억하시나요?
  • Java와 Javascript는 어떤 차이가 있나요?아무 관련 없습니다.
  • 인도와 인도네시아.. 바다와 바다코끼리..

솔직히 자바스크립트 말고 자바언어로 jsp를 이용해서 프론트엔드를 만드는 경우도 허다하다...

하지만 나는 공부를 하는중이기 때문에 자바스크립트 이용한다고 하자!

간단히 자바스크립트를 맛보자면

  <script>

        function hey() {

            alert("안녕!!!");

        }


    </script>

위와 같이 javascript 를 한페이지내에서 사용하기 위해서는 script태그를 head태그 안에있는 style태그 밑에다가 적는다

그렇다면 function(함수)은 무엇인가?


함수

함수는 JavaScript에서 기본적인 구성 블록 중의 하나입니다. 함수는 작업을 수행하거나 값을 계산하는 문장 집합 같은 자바스크립트 절차입니다. 함수를 사용하려면 함수를 호출하고자 하는 범위 내에서 함수를 정의해야만 합니다.

세부 사항에 대해서는exhaustive reference chapter about JavaScript functions를 참조하세요.

함수 정의

함수 선언

함수 정의(또는 함수 선언)는 다음과 같은함수 키워드로 구성되어 있습니다:

  • 함수의 이름
  • 괄호 안에서 쉼표로 분리된 함수의 매개변수 목록
  • 중괄호{ }안에서 함수를 정의하는 자바스크립트 표현

예를 들어, 다음의 코드는square라는 간단한 함수를 정의하였습니다:

function square(number) { return number * number; }

함수square은number라는 하나의 매개변수를 가집니다. 이 함수는 인수 (즉,number) 자체를 곱하여 반환하는 하나의 문장으로 구성되어 있습니다.return 문은 함수에 의해 반환된 값을 지정합니다.

return number * number;

기본 자료형인 매개변수(number와 같은)는값으로 함수에 전달됩니다; 즉, 값이 함수로 전달됩니다. 그러나 함수가 매개변수의 값을 바꾸더라도 이는전역적으로 또는 함수를 호출하는 곳에는 반영되지 않습니다.

만약 여러분이 매개변수로 (예:Array이나 사용자가 정의한 객체와 같이 기본 자료형이 아닌 경우)를 전달하거나 함수가 객체의 속성을 변하게 하는 경우, 다음의 예처럼 그 변화는 함수 외부에서 볼 수 있습니다:

function myFunc(theObject) { theObject.make = "Toyota"; } var mycar = {make: "Honda", model: "Accord", year: 1998}; var x, y; x = mycar.make; // x 의 값은 "Honda" 입니다. myFunc(mycar); y = mycar.make; // y 의 값은 "Toyota" 입니다. // (make 속성은 myFunc에서 변경되었습니다.)

출처: developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Functions

[

함수 - JavaScript | MDN

함수 함수는 JavaScript에서 기본적인 구성 블록 중의 하나입니다. 함수는 작업을 수행하거나 값을 계산하는 문장 집합 같은 자바스크립트 절차입니다. 함수를 사용하려면 함수를 호출하고자 하

developer.mozilla.org

](https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Functions)


내 생각 : 라고 정의 되어 있다.

대충 이런 느낌이라고 생각하면 쉽다. 그렇다면 매개 변수란 무엇인가?


기본값 매개변수
기본값 함수 매개변수 (default function parameter)를 사용하면 값이 없거나 undefined가 전달될 경우 이름붙은 매개변수를 기본값으로 초기화할 수 있습니다.

구문
function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
statements
}
설명
JavaScript에서, 함수의 매개변수는 undefined가 기본입니다. 그러나, 일부 상황에서는 다른 기본 값을 설정하는 것이 유용할 수 있습니다. 이때가 바로 기본값 매개변수 가 필요할 때 입니다.

과거에 기본값 설정을 위한 일반적인 방법은 함수 내부(body)에서 매개변수 값을 검사해 undefined인 경우 값을 할당하는 것이었습니다.

다음 예제에서, multiply호출시 b에 할당된 값이 없다면, b 값은 a*b를 평가할 때 undefined일 거고 multiply 호출은 NaN이 반환됩니다.

function multiply(a, b) {
return a * b
}

multiply(5, 2) // 10
multiply(5) // NaN !
이를 방지하기 위해서, 아래 두번째 줄과 같이 multiply 함수가 오직 한 개의 인수만 있다면 b를 1로 설정하는 방식을 사용하곤 했습니다.

function multiply(a, b) {
b = (typeof b !== 'undefined') ? b : 1
return a*b
}

multiply(5, 2) // 10
multiply(5) // 5
ES2015의 기본값 매개변수로 함수 내부 에서의 검사는 더 이상 필요치 않습니다. 이제, 간단히 함수 머리(head)에서 b의 기본값으로 1 로 설정할 수 있습니다:

function multiply(a, b = 1) {
return a*b
}

multiply(5, 2) // 10
multiply(5) // 5
multiply(5, undefined) // 5

 

출처: developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Functions/Default_parameters

 

기본값 매개변수 - JavaScript | MDN

기본값 매개변수  기본값 함수 매개변수 (default function parameter)를 사용하면 값이 없거나 undefined가 전달될 경우 이름붙은 매개변수를 기본값으로 초기화할 수 있습니다. The source for this interactive e

developer.mozilla.org


내생각: 매개변수란 이런식으로 주로 return 문이 있을때 그 함수 안에서만 그 변수를 사용하고자 할때 이용한다.!