Code Monkey home page Code Monkey logo

javascript-study's Introduction

Javascript Fundamentals Study ๐Ÿ“–

This repository is dedicated to my fundamental knowledge in modern ES6 Javascript. I intend to work on this repository monthly.

License

In this repository I study the practical application of:

  • ES6 functions
  • Types of numeric data (such as int and float)
  • Strings Formatting
  • ES6 Variables
  • Mathematical operations
  • Libraries, Frameworks and ES6 features
  • Decision making (if, else)
  • Repetitions (while, for)
  • User-defined functions
  • My knowledge of English and general JS usage.
  • Advanced use cases

๐Ÿ—บ Directory Map

  1. Conversion Scripts
  2. Math Scripts
  3. Problem Solving Scripts
  4. String Based Scripts
  5. Web Based Scripts

2. Conversion Scripts

Scripts with focus on conversion operations, using part of practical application topics

3. Math Scripts

Mathematical operations scripts to calculate and/or give mathematical results.

4. Problem Solving Scripts

These scripts are daily general problem solving scripts, like an investment calculator, a salary bonus calculation, price per quantity, etc.

5. String Based Scripts

Simple and direct strings scripts with minimal interaction with the user.

6. Web Based Scripts

Simple and direct strings scripts with minimal interaction with the user.

๐Ÿ’ก Useful Snippets and study pieces

Here are some useful snippets to use daily for boosting code efficiency. Every single snippet is coming from a study script that I made from this repository.

Variable types

The recommended way to use variables is to follow ES6 convention.

// Basic ways to declare variables
var oldVariable = "String";
let letVar = 10;
const constVar = true;

// Types
let str = "String";
let int = 10;
let float = 10.5;
let bool = true;
let obj = {};
let arr = [];

Print Methods

In JS there are a couple ways to print variables, these are the basics.

const str = "String";

// Using Alert (Web Browsers)
alert(str);

// Using console.log (Node.js)
console.log(str);
// For those who like to use f-strings in Python:
let str = "String";
let num = 10.5;

console.log(`Look at that! We have ${str} AND ${num} in the same log.`);

If Statement

Very often when you write code, you want to perform different actions for different decisions.

let time = 14;

if (time < 10) {
  greeting = "Good morning";
} else if (time < 20) {
  greeting = "Good day";
} else {
  greeting = "Good evening";
}

Switch Statement

The switch statement is used to perform different actions based on different conditions.

switch (new Date().getDay()) {
  case 0:
    day = "Sunday";
    break;
  case 1:
    day = "Monday";
    break;
  case 2:
     day = "Tuesday";
    break;
  case 3:
    day = "Wednesday";
    break;
  case 4:
    day = "Thursday";
    break;
  case 5:
    day = "Friday";
    break;
  case 6:
    day = "Saturday";
}

For loop

Loops can execute a block of code a number of times.

// Let Sample:

let i = 5;

for (let i = 0; i < 10; i++) {
  // some code
}

// Here i is 5
for (let i = 0; i < 5; i++) {
  text += "The number is " + i + "<br>";
}
// Var Sample:

var i = 5;

for (var i = 0; i < 10; i++) {
  // some code
}

// Here i is 10

For In loop

The JavaScript for in statement loops through the properties of an Object

// Syntax:

for (key in object) {
  // code block to be executed
}

// Example:
const person = {fname:"Nick", lname:"Can", age:19};

let text = "";
for (let x in person) {
  text += person[x];
}

For Of loop

The JavaScript for of statement loops through the values of an iterable object.

// Syntax:

for (variable of iterable) {
  // code block to be executed
}

// Example:
const cars = ["BMW", "Volvo", "Mini"];

let text = "";
for (let x of cars) {
  text += x;
}

While Loop

Loops can execute a block of code as long as a specified condition is true.

var i = 0;

while (i < 10) {
  text += "The number is " + i;
  i++;
}

Functions

A JavaScript function is a block of code designed to perform a particular task.

let x = 10;
let y = 20;

myFunction(x, y);

function myFunction(p1, p2) {
  return p1 * p2;   // The function returns the product of p1 and p2
}

Functions

A JavaScript function is a block of code designed to perform a particular task.

let x = 10;
let y = 20;

myFunction(x, y);

function myFunction(p1, p2) {
  return p1 * p2;   // The function returns the product of p1 and p2
}

Arrow Function

Arrow functions were introduced in ES6. Arrow functions allow us to write shorter function syntax.

// Normal function:
hello = function() {
  return "Hello World!";
}

// Arrow function
hello = () => {
  return "Hello World!";
}

// Other sample:
hello = (val) => "Hello " + val;

Class

JavaScript Classes are templates for JavaScript Objects.

// Syntax:
class ClassName {
  constructor() { ... }
}

// Sample:
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

// Using:
const person = new Person("Nick", 19);

Regular Expression

A regular expression is a sequence of characters that forms a search pattern.

let text = "Visit Microsoft!";
let result = text.replace(/microsoft/i, "W3Schools");

Try Catch (Errors)

A regular expression is a sequence of characters that forms a search pattern.

// Syntax:
try {
  //Block of code to try
}
catch(err) {
  //Block of code to handle errors
}

// Sample:
try {
  throw "Error";
}
catch(err) {
  console.log(err);
}

๐Ÿ“„ License

Permissions of this strong copyleft license are conditioned on making available complete source code of licensed works and modifications, which include larger works using a licensed work, under the same license. Copyright and license notices must be preserved. Contributors provide an express grant of patent rights.

Permissions Restrictions Conditions
โœ“ Commercial Use ร— Liability ๐Ÿ›ˆ License and Copyright Notice
โœ“ Modification ร— Warranty ๐Ÿ›ˆ State changes
โœ“ Distribution ๐Ÿ›ˆ Disclose source
โœ“ Patent Use ๐Ÿ›ˆ Same license
โœ“ Private Use

javascript-study's People

Contributors

dreamdevourer avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.