Frontend Study - 2/Etc

22.06.22 TIL

갓데미 2022. 6. 28. 23:57

 

 

매개변수(parameter) 인자(argument)

함수가 외부에서 입력 받은 데이터를 처리하는 경우

정의된 함수의 소괄호 내부에 name 이라는 단어가 들어 있습니다.

이처럼 함수 이름 소괄호 자리에 적혀 있는 단어는 **매개변수(parameter)**라고 부릅니다.

 

function getName(name) {

return name + '';

}

 

매개변수는 외부로부터 들어오는 값을 담아 함수 내부에서 사용하도록 하는 변수의 역할 합니다.

함수 외부로부터 들어온 값이 담길 '자리' 혹은 **'변수의 이름'**

 

let result1 = getName('개발자');

 

console.log(result1); // 콘솔에 '개발자님' 출력

만든 함수는 여러 호출할 있습니다. 반환값을 변수에 저장해 두면 매번 확인할 있습니다.

 

'개발자' 같은 실질적인 값을 인자(argument) 라고 합니다.

앞서 **매개변수(parameter)** '자리' 혹은 '변수의 이름'

반면, **인자(argument)** 자리에 들어갈 구체적인 값.

 

 

 

후위 연산자(postfix operator)?

  • (), 자리 ()

num++

후위 연산자 연산자가 변수의  치된

let x = 3;

const y = x++;

 

console.log(`x:${x}, y:${y}`); // x:4, y:3


결과 x:4, y:3

후위 연산자는 변수를 먼저 할당(대입) 뒤에 연산을 수행

 

 

전위 연산자(prefix operator)?

  • (), 자리 ()

// Prefix increment

++num

전위 연산자 연산자가 변수의  치된

let x = 3;

const y = ++x;

 

console.log(`x:${x}, y:${y}`); // x:4, y:4

 

전위 연산자 후위 연산자와는 반대로,
연산을 먼저 수행한 뒤에 변수를 할당(대입)

 

 

 

text and string

  • 서로 다른 type String + Number 시도할 때는 항상 주의
  • String Number형을 더하면 항상 String 형으로 변환됩니다.

 

 

 

다차원배열의 출력

function getElement() {

  let arr = [3, [4, ["array", 9], 2+3], [0]];

  return arr[1][1][0];

}

 

 

 

배열안의 최대값 최소값 

Spread Operator(전개 연산자) + Math.max(), Math.min()

 

 

 

 

 

toUpperCase  toLowerCase 메소드를 호출하여 반환되는

 

let lastName = 'Yeri Kim';

let upperLastName = lastName.toUpperCase();

let lowerLastName = lastName.toLowerCase();

 

console.log(lastName); // Yeri Kim

console.log(upperLastName); // YERI KIM

console.log(lowerLastName); // yeri kim

 

 

 

 

Date!

let rightNow = new Date();

let year = rightNow.getFullYear();

let month = rightNow.getMonth()+1;

let date = rightNow.getDate();

let day = rightNow.getDay();

let currentHour = rightNow.getHours();

let currentMin = rightNow.getMinutes();

 

 

getMonth 메서드는, 현재 달보다 1 작은 값을 반환 하므로 주의

 

 

 

특정 최대값 최소값 사이의 랜덤넘버

function getRandomNumber (min, max) {

  min = Math.ceil(min);

  max = Math.floor(max);

  var a = Math.floor(Math.random() * (max - min + 1) + min);

  return a

}

 

 

많이 쓰이는 객체 구조

let objData = {

  name: 50,

  address: { 

    email: "gaebal@gmail.com",

    home: "위워크 선릉2호점"

  },

  books: {

    year: [2019, 2018, 2006],

    info: [{

      name: "JS Guide",

      price: 9000

    }, {

      name: "HTML Guide",

      price: 19000,

      author: "Kim, gae bal"

    }]

  }

};

 

 

 

etData 함수를 구현해주세요!

  • getData 함수는 개의 배열을 인자로 받습니다.
  • 다음 요구사항을 충족하는 객체를 만들어서 return 해주세요.
  • 리턴되는 객체는 아래와 같이 3개의 property 가집니다.

 

function getData(salesArr, reviewArr, likeArr) {

  let amount = 0;

  let review = 0;

  let like = 0;

 

  for (i = 0; i < salesArr.length; i++) {

    amount = amount + salesArr[i][1];

  }

 

  for (i = 0; i < reviewArr.length; i++) {

    review = review + reviewArr[i][1];

  }

 

  for (i = 0; i < likeArr.length; i++) {

    like = like + likeArr[i][1];

  }

  return { sumAmount: amount, sumReview: review, sumLike: like };

}

 

 

 

function okay(name, callback, like) {

this.name =name;

this.like =like;

 

this.callback = () { console.log(“이거였지”) }

 

};

 

let ray = {  

  name: 'Ray',  

  price: 2000000,   

  getName: function() {  

    return this.name;  

  },   

  getPrice: function() {  

    return this.price;  

  },   

  applyDiscount: function(discount) {  

    return this.price * discount;   

  } 

}

 

 

 

8-2. string method

ES6에서 추가된 가지 유용한 string method 소개해 드립니다.

동안 string에서 특정 string 찾기 위해 indexOf  사용했었습니다.

그런데 이제 아래의 3가지 method 생겼습니다.

이름 그대로 기능을 파악하시면 됩니다.

  • startsWith
  • endsWith
  • includes

 

const email = 'yealee.kim87@gmail.com';

 

console.log(email.startsWith('ye'));

console.log(email.endsWith('com'));

console.log(email.includes('@gmail'));

 

const handleEdit = (nickname, ...interests) => {

  return {

  nickname : `${nickname}`,

  interests : `${interests}`

  bio : ` 닉네임은 ${뚜비}입니다. 취미는 ${interests}입니다.`,

}

}

리턴 생각을 못하고 아래처럼 했다

 

 

 

1.1 구분자만 인자로 전달

구분자만 인자로 전달하면 문자열을 구분자로 분리하고 배열 담아 리턴합니다.

let str = 'Hello, World, Javascript';

 

console.log(str.split(','));

Output:

[ 'Hello', ' World', ' Javascript' ]

 

const handleEdit = (nickname, interests) => {

 

  let newInterests = interests.split(',');

 

  return {

    nickname : `${nickname}`,

    interests : newInterests,

    bio : ` 닉네임은 ${nickname}입니다. 취미는 ${newInterests}입니다.`,

    

  }

 

 

const okay = handleEdit("뚜비" , "방탈출,테니스, 때리기");

console.log(okay);

 

괜히 어렵게 생각했다. 

 

interests : newInterests,

이렇게 하면 그냥, `` 백틱안에 배열을 넣으면 배열이 사라진다는 알았다. 

 

 

 

Object.entries 객체의 키와 값의 쌍으로 이루어진 길이 2짜리 배열로 이루어진, 배열을 리턴합니다.

배열에서 인덱스 [0] 값은 각각의 키를, 인덱스 [1] 값은 해당 키에 해당하는 값을 가지게 됩니다.

 

const values = Object.values(obj)

// values === ['melon', 4350, 16500, true]

 

const entries = Object.entries(obj)

 

/*

entries === [

['name', 'melon'],

['weight', 4350],

['price', 16500],

['isFresh', true]

]

*/

 

 

JavaScript - 문자열 자르기 (split, substr, substring, slice)