49 javascript 꿀팁

source: categories/study/vue-experiance/vue-experiance_9-39.md

자바스크립트 꿀팁

1. Removing Duplicate Items

function showData(obj) {
    document.body.innerHTML = obj;
}

const array = [1, 2, 2, 2, 3, 3, 3, 4, 5, 10];

//! Removing Duplicate Items
//! a SET contains only unique elements
//! and... is the spread operator used to convert
const unique = [...new Set(array)];

showData(unique); // [1, 2, 3, 4, 5, 10]

2. To avoid false values we use || operator

function showData(obj) {
    document.body.innerHTML = obj;
}

var tmp = null;

// To avoid false values we use || operator

showData(tmp || "NOT PRESENT"); // "NOT PRESENT"

function showData(obj) {
    document.body.innerHTML = obj;
}

var tmp = 0;

// BUT 0 also return false

showData(tmp || "NOT PRESENT"); // "NOT PRESENT"

3. to avoid 0 return false we use ?? operator

function showData(obj) {
    document.body.innerHTML = obj;
}

var tmp = 0;

// to avoid 0 return false we use ?? operator

showData(tmp ?? "NOT PRESENT"); // 0

function showData(obj) {
    document.body.innerHTML = obj;
}

var tmp = 0;

// it looks for null / undefined values

showData(tmp ?? "NOT PRESENT"); // 0

function showData(obj) {
    document.body.innerHTML = obj;
}

var tmp = null;

// it looks for null / undefined values

showData(tmp ?? "NOT PRESENT"); // "NOT PRESENT"

function showData(obj) {
    document.body.innerHTML = obj;
}

var tmp = undefined;

// it looks for null / undefined values

showData(tmp ?? "NOT PRESENT"); // "NOT PRESENT"

4. single ? operator

function showData(obj) {
    document.body.innerHTML = obj;
}

const obj = {
    func1() {
        console.log('ok');
    },
    func2() {
        console.log('ok2')
    }
}

obj.func1();
obj.func2();
obj.func3?.();

5. prompt

function showData(obj) {
    document.body.innerHTML = obj;
}

var a = window.prompt('INPUT SOME CODE');

//! How to execute this string stored in 'var a'

eval(a);

// warning: do not execute any code from users without verifying!

6. string template

function showData(obj) {
    document.body.innerHTML = obj;
}

var t1 = 'hey';
var t2 = 'there';

showData(`${t1} MR. ${t2} How are you`);

7. true, false로 판단하는 방법 !! (how to convert to boolean?)

function showData(obj) {
    document.body.innerHTML = obj;
}

var yes = {
    obj1: "something is present",
}

var no = null;

showData(!!yes); // true
showData(!!no); // false

8. how to convert to number?

function showData(obj) {
    document.body.innerHTML = obj;
}

var str = "25";
var str2 = "26";

showData(typeof +str); // "number"

function showData(obj) {
    document.body.innerHTML = obj;
}

var str = "25";
var str2 = "26";

showData(+str + str2); // "2526"

function showData(obj) {
    document.body.innerHTML = obj;
}

var str = "25";
var str2 = "26";

showData(+str + (+str2)); // 51

9. how to convert to string?

function showData(obj) {
    document.body.innerHTML = obj;
}

var int1 = 51;
var int2 = 201;

showData(int1 + int2); // 252

function showData(obj) {
    document.body.innerHTML = obj;
}

var int1 = 51;
var int2 = 201;

showData(int1 + "" + int2); // "51201"