DEV Community: Agikonyo

Modern JavaScript for everyone: Mastering Modern JavaScript The Right Way

Agikonyo — Fri, 04 Mar 2022 09:16:06 +0000

A. What is JavaScript?
B. What one requires to learn programming

Introduction JavaScript is one of the world’s most popular programming language. It is also a scripting or programming language that allows you to implement complex features on web pages as It makes the webpages interactive displaying timely content updates, interactive maps, animated graphics. JavaScript was invented by Brendan Eich in 1995 The early versions of JavaScript were called Mocha
To learn JavaScript one requires to understand the following:

a) Recognize that you don’t know it and use that as motivation to read on it and get better at it

b) Each time your code works always challenge yourself to learn something new and try out another task. Don’t get comfortable that you are good at it

c) Get functional- functional programming is a programming paradigm where programs are constructed by applying and composing functions.
To get a better understanding of getting functional; Understand the following concepts

i. Immutability- This means that we can't change values in variables, objects, or even arrays. Instead, we need to create a new variable, object, or array.

ii. Pure functions - This means that functions will always return an output, but cannot have side effects nor can it rely on external variables or state
iii. Composition – This is the functionality of more complex objects. Instead of focusing on what an object is, we focus on what an object can do
**_iv. Closures** - This is an inner function that has access to variables from an outer function. In JavaScript, closures are created every time a function is created, at function creation time
v. Currying – This is when we take a function with multiple arguments and then rewrite it as a series of functions, each with one argument
vi. Recursion -This is simply a function that calls itself
d) Keep up with the latest specs
Just make sure you keep up with the most recent changes to JavaScript, which means everything from ES2015 on for example you should know the following features from later specs;
i. Async functions from ES2017(ES8)
ii. Object rest/spread properties from ES2018(ES9)
e) Embrace asynchrony
This model allows multiple things to happen at the same time. You should learn the following tools as well to understand this concept better;
i. Promises
ii. Bonus
iii. Async/Wait
iv. Know where the language ends and the framework begin
f) Framework
If you’re using a framework, make sure you know when you are using JavaScript and when you are using the framework
g) Learn about prototypal inheritance
h) Make your code editor fun
For example, Visual studio (Vs Code) has extensions such as prettier, which are free that can be used to make your project look fun and exciting
i) Always Test your code
Test-driven development encourages you to start small and break a big problem into many smaller parts
j) Build an environment from scratch
An environment is the data structure that provides storage space. To understand JavaScript better try to create your own environment, rather than reusing the environment that was created previously
k) Teach others what you’ve learned
Have discussions and teach others what you have learnt thus with practice you will understand better the concepts after doing it a number of times.
l) Ask questions
Always ask questions to get clarity and a better understanding of JavaScript and also to learn from others and get different perspectives from other programmers with experience in the same field. We learn by asking questions and willing to learn from others

Introduction to Data Structures and Algorithms with Modern JavaScript

Agikonyo — Mon, 21 Feb 2022 12:54:07 +0000

In this article we will tackle the following:
i. What are data structures and Types of Data Structures?
ii. What is an Algorithm?

Data Structures
Data structures allow you to manage data. They help us to store and organize the data primitives, so that they can be efficiently accessed and used in algorithms.
a. Arrays
Arrays are ordered list of sequences of primitive data types, that are a special variable, which can hold more than one value. There are two object-oriented implementations of array-like objects: queue and stacks. In Array data duplicates are allowed, Size is adjusted dynamically, elements are accessed via index and are iterable (therefore, you can use the for loop)

b. Hashtable / map
A hash table is a dictionary-like data structure, where keys are paired with values. Maps are great for rapid retrieval and modification of data since they store data for easy access. Maps have become nearly ubiquitous. They are Ordered key value with pairs of data, and one can access data via keys. Maps are iterable and keys can be anything (we can use reference values)
c. Objects
In objects we group data into one. The keys that are used in objects have to be numbers or strings. Keys are important because they’re unique while values are not .Objects have contracts that can store data .Objects can contain methods and functionalities and are not iterable

d. Sets
Sets are unordered list of data, that doesn’t allow duplicates. In sets Insertion order is not stored, We access and extract data via method, iterable is allowed one ( can use the for loop)

e. Stacks
A stack is an ordered list which follows LIFO (last in first out) algorithm. You can access the elements of a stack from only a single end.

Algorithms
An algorithm is a sequence of steps to solve a well-defined problem. A set of rules that precisely define a sequence of operations. We have different types of algorithms as stated below;
i. Binary Search
This is a divide and conquer algorithm, that divides the array in half every time it checks whether an element of the array is the one, we're looking for.
ii. Big O notation
This is a way of representing the general growth in the computational hardness of a task as you increase the data set. We have 5 types of Big O notation as stated below
• O(1)
• O(n)
• O(n^2)
• O(log n)
• O(n!)

iii. Imperative code
This is when you tell your program every single step to achieve a specific outcome as per your expected output.
iv. Recursion
This is a programming technique using function or algorithm that calls itself one or more times until a specified condition is met at which time the rest of each repetition is processed from the last one called to the first. Recursion involves solving problems by breaking things down into simpler/smaller versions of themselves
v. Tail recursion
This is when, instead of doing an invocation of the recursive function as the return statement, it does a jump and reuses the same context of the prior recursive called.

Ultimate JavaScript Guide or Introduction to Modern JavaScript

Agikonyo — Mon, 14 Feb 2022 08:18:27 +0000

On this article will discuss the following topics on JavaScript;

What is JavaScript?
A Simple JavaScript Syntax
Variables in JavaScript
Data types in JavaScript
Array methods in JavaScript
Loops in JavaScript
Conditional statements

Introduction into JavaScript
JavaScript is an open source and commonly known as a client-side scripting language, which is dynamic and is used to enhance the interaction of webpages. To run JavaScript You can use the web console of your preferred browser like Chrome (ctrl+shift+I on windows and ctrl+shift+k on mac ) or you can use code editors like Visual Studio code, Atom or sublime text.

Simple JavaScript Syntax
// This is my first code (This indicates a comment that gives more information about the code but is not executed)
/Welcome to my first code
Happy coding/ (This is used in cases where we have multiple lines of comments)

Example of a simple JavaScript syntax;

Variables in JavaScript
All JavaScript variables must be identified with unique names referred to as identifiers

How to declare variables in JavaScript
As shown below num, are variables, declared with the var keyword

a) Var

b) Strings
In cases where we have, we dealing with a string value, we also declare a variable, initializing it with a string value, and then returning the value. Point to note where dealing with a string you need to surround the value with quote

c) Let
As shown below a, b and c are variables, declared with the let keyword

d) Const
This defines a constant reference to a value. You cannot reassign a value, array or an object

        **Data types in JavaScript**

We have 7 data types in JavaScript namely; string, number, bigint, Boolean, null, undefined, and symbol. We will have a discussion on what each of them represents

i. String
A string (or a text string) is a series of characters like “Ann”. When using a string it’s supposed to be quoted with either a single quote or a double quote

ii. Number
JavaScript has only one type of numbers such as 1,2,3,4. In number values we can use the ones with a decimal point or not as both are allowed

iii. Bigint
For a bigint, this is similar to the number data type but it holds bigger values. For this you add the letter n, next to you value to indicate that it’s an integer,

iv. Boolean
Booleans can only have two values; True or False

              **Array methods in JavaScript**

An array object is used to store multiple values in a single variable

JavaScript Arrays are divided into two
One-dimensional arrays- This is a linear array which consists of only one row or column
Multi-dimensional arrays- This is an array with two or more columns

             **Loops in JavaScript**

In cases where you would want to run the same code multiple times, each time with a different value
FOR - loops through the code specified for a number of times

WHILE - loops through a block of code for as long as the specified condition is true

DO WHILE – This condition loops for as long as the specified condition is true

          **Conditional statements**

We have four types of conditional statements in JavaScript

IF- This is when we have a block of code is executed, if the set condition is true
Syntax

if (condition) {
// code to be executed if the condition is true
}

ELSE- This is else to specify a block of code to be executed, if the same condition is false
Syntax
if (condition) {
//code to be executed if the condition is true
} else {
//code to be executed if the condition is false
}

ELSE IF- This is used else if to specify a new condition to test, if the first condition is false
Syntax
if (condition1) {
//code to be executed if condition1 is true
} else if (condition2) {
//code to be executed if the condition1 is false and condition2 is true
} else {
//code to be executed if the condition1 is false and condition2 is false
}

SWITCH- We use switch to select one of many blocks of code to be executed
Syntax
switch(expression) {
case n:
//answer block of code
break;
case n:
//answer block of code
break;
default:
default //answer block of code
}