Skip to content

Instantly share code, notes, and snippets.

View WNortier's full-sized avatar
🐭
Gee Brain, what do you wanna' do tonight?

Warwick WNortier

🐭
Gee Brain, what do you wanna' do tonight?
  • Avocado Chocolate
  • South Africa
View GitHub Profile
@WNortier
WNortier / generics.ts
Created April 1, 2023 07:27
Generics
// Generics
const names: Array<string> = []; // string[]
names[0].split(' ');
const promise: Promise<number> = new Promise((resolve, reject) => {
setTimeout(() => {
resolve(10);
}, 2000);
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>encodeURI vs encodeURIComponent</title>
<style>
html {
font-size: 20px;
@WNortier
WNortier / for-in-vs-for-of.js
Created December 28, 2022 08:50
for-in-vs-for-of
/*
Difference for..in and for..of:
Both for..in and for..of are looping constructs which are used to iterate over data structures.
The only difference between them is the entities they iterate over:
- for..in iterates over all enumerable property keys of an object
- for..of iterates over the values of an iterable object. Examples of iterable objects are arrays, strings, and NodeLists.
*/
let arr = ['el1', 'el2', 'el3'];
@WNortier
WNortier / object-destructuring.js
Last active December 27, 2022 13:00
object-destructuring
const newsStory = {
title: 'Inflation is soaring',
author: null,
thumbnail = 'dollar.jpg',
meta: {
year: 2022
}
}
const {title: tit, author: auth = 'Unknown', thumbnail} = newsStory
// nested loops and multi-dimensional objects
// We can use nested loops to access all the elements
// inside multi-dimensional arrays or objects
let twoD = [[1, 2, 3, 4, 5, 6, 7],
[8, 10, 5, 7, 3, 22, 6, 42],
[123, 54, 12, 11, 9, 15]];
let bigHero = {characters:[
{name:'Hiro', voice:'Ryan Potter'},
<button onClick={
() => {
navigate('/about', { state: { id: 1, name: 'sabaoon' }})
}
}>Change to about page</button>
import { useLocation } from 'react-router-dom';
import Button from 'react-bootstrap/Button';
const UseLocationExample: React.FC = () => {
<Route path="/profile/:username" element={<ProtectedRoute user={user}><UseParamsExample /></ProtectedRoute>} />
import { useNavigate, useParams } from "react-router-dom";
const UseParamsExample: React.FC = () => {
let navigate = useNavigate();
let { username } = useParams();
return (
<div className="profile">