[20220724 S]

devbit4 [front-end developer]·2022년 7월 24일
0

TIL

목록 보기
94/163

조건문 (if, switch)

let age=1;

switch(value){
	case1: console.log(1)
    case2: console.log(2)
    case3: console.log(3)
    default: console.log("d")
    break;
}
1 2 3 d (break를 중간에 안 쓰면 )

반복문 (for~of/ for~in)

for (const item of array){
console.log(item)
}

for (const index in array){
console.log(array[index])
}  // 잘 안씀 키값을 꺼내올 때 씀

const obj={
	color: "blue",
    width:200,
    height:200
}

for (const key in obj){
	console.log(key)
} //color, width,height

함수 타입 앨리어스, 인터페이스

type FunFunction = ()=>string;


type Example = {
	(url:string, search?:string) : Promise<string>;
}
interface Example {
	(url:string, search?:string) : Promise<string>;
}

가변인자 ...args // arguments 유사배열

function sum(a,b,...args){
	let s=0;
    for(let i=0; i<args.length; i++){
    s=s+args[i]
    
    return s;
}

 arguments 유사배열을 배열로 바꾸려면 ? Array.from()

함수 호출 call() apply()

sum(10,20,30)
sum.call(null,10,20,30);
sum.apply(null,[10,20,30]);

const arr = [10,20,30];
sum.apply(null,arr);

즉시실행함수

(function(){console.log("dd")})()

generator 함수 =>많이 쓰이지는 x

function* gen(){
	yield 10;
    yield 20;
    return 30;
}

const g =gen();
g.next();
g.next();
g.next();

비동기

async function example(){

}

축약형

const obj={
	getData:function(){
    	return "data";
    }
}

const obj={
	getData(){
    	return "data";
    }
}

Object.create (js에서)

const obj =Object.create(null,{
	age:{
    	value:26,
        writable:false, // 바꿀 수 없음
        configurable: false // 지울 수 없음 
    }
})

일급함수

https://velog.io/@mgm-dev/%EC%9D%BC%EA%B8%89%ED%95%A8%EC%88%98%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80

function salePrice(discountRate){
	return function(price){
    	return price-(prcie*(discountRate * 0.01))
    }

}


console.log(salePrice(30)(200000))

//반환값으로 함수가 올때 아래에 방법 권장
let summerPrice=salePrice(30);
console.log(summerPrice(200000))

비동기 함수

function timer(s:number):Promise<string>{
	return new Promise((resolve,reject)=>{
    	setTimeout(()=>{
        	if(Math.random()*10===2){
            	resolve("good luck");
            }else{
            	reject("fail");}
    },s)
})
} 

timer(2000)
.then((result:string)=>{console.log(result)})
.catch((error:string)=>{console.log(error)})

async function hello(){
	try{
    	const result =await timer(2000);
        console.log(result);
    }catch(e){
    	console.log(e);
    }

}

hello();

객체 생성(객체 리터럴 vs 함수 vs class)

let makeObj={
	name:"lim",
    age:20
}

function makeObj(name,age){
	return {
    	name,age
    }
}

makeObj("lim",20)

//함수가 구조 변경 시 용이함


class Person {
	construnctor(name,age){
    	this.name =name;
        this.age=age;
    }	
}
const makeObj = new Person("lim",20)

복사를 해보자! Object.assign() vs 전개연산자 vs 문자열=>객체

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

const box ={a:1, b:2};
const box2 =Object.assign({},box);
const box3 = {...box};
const box4 = JSON.parse(JSON.stringify(box));

class get set private field

https://ko.javascript.info/private-protected-properties-methods

[] vs {} vs ()

() - Round brackets or parentheses

[] - Square brackets

{} - Curly brackets or braces

<> - Angle brackets or chevrons

slice (시작, 미포함하는 끝) vs splice(시작, 제거할 요소수, 추가요소)

원래 배열 수정 안 함 => slice
원래 배열 수정함 => splice

reduce

const objs = [
	{a: "1"},
    {b: "ss"},
    {c: "yy"}
]

const reducedObj = objs.reduce((a,b)=>({...a,...b}),{})

//console.log(reducedObj) 
// {
        a:"1",
        b:"ss",
        c:"yy"
				}

private vs protected vs public

private 과 protected 외부로 공개x
차이점 private 클래스 자체 protected 상속받은 클래스도 ok

const array =[];
for(const item of items){

	const row =[];
    for(const [key,value] of Object.entries(item)){
    	row.push(value);
    }
	
    array.push(row.join());
}
console.log(array.join("&&&"))
profile
제대로 꾸준하게 / 블로그 이전 => https://dailybit.co.kr

0개의 댓글