DEV Community: Bode

Regular Expression in JavaScript

Bode — Thu, 24 Jun 2021 21:27:41 +0000

A regular expression is an object that describes a pattern of characters. Regular expressions are often abbreviated "regex" or "regexp".

The JavaScript RegExp class represents regular expressions, and both strings and RegExp define methods that use regular expressions to perform powerful pattern matching and search-and-replace functions on the text.

In simpler terms, a regular expression is a sequence of characters that forms a search pattern.

When you search for data in a text, you can use this search pattern to describe what you are searching for.

A regular expression can be a single character, or a more complicated pattern.

A regular expression can be defined as:

var pattern = new RegExp(pattern,attributes);
OR
var pattern = /pattern/attributes;

Using String Methods

In JavaScript, regular expressions are often used with the two string methods: search() and replace().

The search() method uses an expression to search for a match, and returns the position of the match.

The replace() method returns a modified string where the pattern is replaced.

Using String search() With a String.

The search() method searches a string for a specified value and returns the position of the match:

Example:

Use a string to do a search for "thewebguyy" in a string:

let text = "Visit thewebguyy!";
let n = text.search("thewebguyy");

The result in n will be:

Using String search() With a Regular Expression

Example:
Use a regular expression to do a case-insensitive search for "thewebguyy" in a string:

let text = "Visit thewebguyy";
let n = text.search(/thewebguyy/i);

The result in n will be:

Using String replace() With a String

The replace() method replaces a specified value with another value in a string:

let text = "Visit Hashnode!";
let result = text.replace("Hashnode", "thewebguyy");

Use String replace() With a Regular Expression

Example:

Use a case insensitive regular expression to replace Microsoft with W3Schools in a string:

let text = "Visit Hashnode!";
let result = text.replace(/hashnode/i, "thewebguyy");

The result in res will be:

Visit thewebguyy!

Note that: Regular expression arguments (instead of string arguments) can be used in the methods above.
Regular expressions can make your search much more powerful (case insensitive for example).

Regular Expressions Modifiers

Modifiers are used to perform case-insensitive more global searches:

Regular Expression Patterns

Brackets are used to find a range of characters:

Metacharacters are characters with a special meaning:

Quantifiers define quantities:

Using the RegExp Object

In JavaScript, the RegExp object is a regular expression object with predefined properties and methods.

Using test()

The test() method is a RegExp expression method.

It searches a string for a pattern, and returns true or false, depending on the result.

The following example searches a string for the character "e":

Example:

const pattern = /e/;
pattern.test("The best things in life are free!");

Since there is an "e" in the string, the output of the code above will be:

true

You don't have to put the regular expression in a variable first.

The two lines above can be shortened to one:

/e/.test("The best things in life are free!");

Using exec()

The exec() method is a RegExp expression method.

It searches a string for a specified pattern, and returns the found text as an object.

If no match is found, it returns an empty (null) object.

The following example searches a string for the character "e":

Example:

/e/.exec("The best things in life are free!");

You can read a complete reference here

DOM: Detailed Explanation of DOM.

Bode — Tue, 15 Jun 2021 13:23:52 +0000

DOM means Document object model. The DOM is a programming language interface for HTML and XML(Extensible markup language) documents. It defines the logical structure of documents and the way a document is accessed and manipulated.

A Web page is a document. This document can be either displayed in the browser window or as the HTML source. But it is the same document in both cases. The Document Object Model (DOM) represents that same document so it can be manipulated. The DOM is an object-oriented representation of the web page, which can be modified with a scripting language such as JavaScript.

DOM is a way to represent the web page in the structured hierarchical way so that it will become easier for programmers and users to glide through the document.

Structure of DOM:

DOM can be thought of as Tree or forest (which is more than one tree). The term structure model is sometimes used to describe the tree-like representation of a document. One important property of DOM structure models is structural isomorphism.

Why is it called Object Model?

Documents are modeled using objects, and the model includes not only the structure of a document but also the behavior of a document and the objects of which it is composed of like tag elements with attributes in HTML.

Accessing the DOM

You don't have to do anything special to begin using the DOM. Different browsers have different implementations of the DOM, and these implementations exhibit varying degrees of conformance to the actual DOM standard (a subject we try to avoid in this documentation), but every web browser uses some document object model to make web pages accessible via JavaScript.

Levels of DOM:

Level 0: Provides a low-level set of interfaces.

Level 1: DOM level 1 can be described in two parts: CORE and HTML.

CORE provides low-level interfaces that can be used to represent any structured document.

HTML provides high-level interfaces that can be used to represent HTML documents.

Level 2 : consists of six specifications: CORE2, VIEWS, EVENTS, STYLE, TRAVERSAL, and RANGE.

CORE2: extends the functionality of CORE specified by DOM level 1.

VIEWS: views allows programs to dynamically access and manipulate the content of the document.

EVENTS: Events are scripts that are either executed by the browser when the user reacts to the web page.

STYLE: allows programs to dynamically access and manipulate the content of style sheets.

TRAVERSAL: allows programs to dynamically traverse the document.

RANGE: allows programs to dynamically identify a range of content in the document.

Level 3: consists of five different specifications: CORE3, LOAD and SAVE, VALIDATION, EVENTS, and XPATH.

CORE3: extends the functionality of CORE specified by DOM level 2.

LOAD and SAVE: allows the program to dynamically load the content of the XML document into the

DOM document and save the DOM Document into an XML document by serialization.

VALIDATION: allows the program to dynamically update the content and structure of the document while ensuring the document remains valid.

EVENTS: extends the functionality of Events specified by DOM Level 2.

XPATH: XPATH is a path language that can be used to access the DOM tree.

How to code on your own..

Bode — Mon, 17 May 2021 19:20:22 +0000

Let's explore how tutorials can hold you back.
you might have been through all the tutorials under the sun, But still feel lost when coding on your own??

Why does this happen?

This is called being stuck in "tutorial hell"
This is when you never build your projects and rely on tutorials.
break away from tutorials to see what you actually know.
You'll learn considerably faster when you start applying what you've learnt.

Are you stuck in tutorial hell?
Let me know in the comments.

MOST POPULAR WEB DEV STACKS

Bode — Mon, 10 May 2021 00:12:55 +0000

1) LAMP:
Linux , Apache, MySQL, Php

2) LEMP:
Linux, Nginx, MySQL, Php

3) MERN:
MongoDB, Express, React, NodeJS

4) MEVN:
MongoDB, Express, Vue, NodeJS

5) MEAN:
MongoDB, Express, Angular, NodeJS

If this post is helpful for you, leave and reaction and share.

IF I WERE STARTING FROM ZERO. A Step by step plan on how to go from 0 - 100 in programming.

Bode — Mon, 10 May 2021 00:03:58 +0000

1) Find a tech path that interests you. There are lot of tech paths like iOS, Android, Web, Game.

2) Find the right languages to learn for that path choosen

iOS/Swift
Android/Kotlin
Web/HTML, CSS, JAVASCRIPT
Game/ C++

3) Spend 2-3 hours a day learning to the language 1 at a time.

4)Find mentor-ship and guidance. Like Discord groups, Stackoverflow, Personal mentorship

5)Stay consistent and enjoy the process.

What would you do if you were starting back at zero? Comment and give a reaction.

YOU SHOULD REMEMBER THESE ADVICES

Bode — Sun, 09 May 2021 23:56:49 +0000

As a programmer you should take note of these simple but very important things or you will feel bad or noob.

1) Master the basics.

2) First solve a problem, then code.

3) Practice consistently, Build Projects.

4) Join an online developer community.

5) Use tools to save time.

Give a reaction. Something in your mind? Comment.

MOTIVATION DOESN'T MATTER

Bode — Sat, 08 May 2021 18:57:15 +0000

Have you ever said:
"I don't have the time to code today"

Let me tell you the truth, If you rely on motivation.. You will FAIL!!

If you're relying on motivation to succeed as a developer you're not going to succeed at all.

In order to become a better programmer you need to implement coding into your lifestyle. That may require sacrificing those lounging breaks on the weekend.

Those days where you lack motivation become wasted days that put you one step behind.

If you truly want to learn how to code, you don't need motivation, You need a lifestyle change.

Set a time during the day that you can dedicate towards coding.

4 things to help you learn how to code fast

Bode — Wed, 05 May 2021 22:26:39 +0000

If you're looking for a fast way to learn how to code. You need to know these 4 things:

Mentorship: It will help you get through any questions you may have.
Personal Projects: It helps you to be passionate about what you're learning.
Daily challenges: It helps you sharpen your skills with a new problem to solve every day.
2 - 4 hours a day to dedicate to coding a minimum. You stay consistent that way every single day.

What is JAVASCRIPT??

Bode — Wed, 03 Mar 2021 17:50:03 +0000

Computers are incredibly powerful machines, capable of performing amazing feats like playing competitive chess, serving thousands of web pages, or making millions of complex calculations in less than a few seconds. But deep down, computers are actually really dumb. Computers can only do exactly what we humans tell them to do.

We tell computers how to behave using computer programs, which are just sets of instructions for the computers to follow. Without programs, computers can’t do anything at all!

Meet Javascript
Even worse, computers can’t understand English or any spoke. Language. Computer programs are written in programming language like Javascript. You might not have heard of JavaScript before, but you’ve certainly used it. The JavaScript programming language is used to write programs that run in webpages. Javascript can control how a web page looks or make the page respond when a viewer clicks a button or moves the mouse.

Sites like Gmail, Facebook and Twitter use JavaScript to make it easier to send email, post comments, or browse websites. For example, when you’re on twitter reading tweets from @thewebguyy and you see more tweets at the bottom of the page as you scroll down, that’s JavaScript in action.

You only have to visit a couple of websites to see why JavaScript is so exciting.

Javascript lets you play music and create amazing visual effects.
Javascript lets you build tools for others to make their own art.
Javascript lets you play and code fun games.

Why learn Javascript?

Javascript isn’t the only programming language out there --infact, there are literally hundreds of programing languages.
But there are many reasons to learn Javascript.

Why? Because:
It’s a lot easier and more fun to learn than any other programming language. But perhaps best of all, in order to write and run JavaScript programs, all you need is a web browser like google chrome, Mozilla Firefox. Every web browser comes with a Javascript interpreter that understands how to read JavaScript programs. Once you’ve written a Javascript program, you can send people a link to it, and they can run it in a web browser on their computer, too!

You can check out more about Javascript in your free time.
If you need help or a teacher to help and assist you, you can connect with me. I'm always ready to help.

Don't just write codes, solve problems.

Bode — Mon, 22 Feb 2021 15:22:22 +0000

You’ve gotten stuck so many times while coding. We all have. Some hard, nasty problem. Many conditions. Maybe this can be broken down into smaller problems. Maybe some dynamic programming could help. There must be some famous algorithm behind this.

We’re programmers, so writing code is what we do, is it not ? As the title suggests, our job is a bit more complicated than stroking keys on a keyboard in front of a screen all day. If you go beyond programming languages, and frameworks and processes, beyond test suites and sprints and Jira tickets, you will always find a problem that needs to be solved. Let me say that we, as programmers, are, first and foremost, problem solvers. We take a problem that someone else has and, using all the tools at our disposal, produce a solution.

Programmers seem to have forgotten the real purpose of software, that is to solve a real-world problem. If developers become too narrowly focused on development, they can miss the purpose behind the software or program they write. They may not see hidden solutions that don’t require any code.

The best in their field are the ones who appreciate that there is always more to learn. Here are six steps to becoming a better programmer this year.

Coding is an evolving discipline.

Write code three times.
Writing code has been compared to writing a novel and,just like in novel writing, you should never tout your first draft as your finished product.

Practice a lot. (Get addicted)
Always try to get a solution which is most efficient for the problem Never compromise on complexity.
Start a day coding an easy problem. This will make you feel better.
Once you have given up. Understand the problem how much ever difficult it is.
Don't underestimate yourself.
Before you code, it would be better if you write down the algorithm and check if it is working for all test cases. It would be much much better if you could prove your algorithm.

Solve logical puzzle,Write your own programmes, Develop projects for yourself in that language.
Practice and practice coding whenever you get time.

Stay more with good programmers, your teachers, mentors and gain or suck knowledge from them.

HAPPY CODING!!