pull/286/head
Asabeneh 3 years ago
parent 9fc1c2a87c
commit 7ccf2de915

@ -11,7 +11,7 @@
<button onclick="alert('Welcome to 30DaysOfJavaScript!');">Click Me</button> <button onclick="alert('Welcome to 30DaysOfJavaScript!');">Click Me</button>
<script src="./helloworld.js"></script> <script src="./helloworld.js"></script>
<script src="./introduction.js"></script> <script src="./introduction.js"></script>
<script src="./varaible.js"></script> <script src="./variable.js"></script>
<script src="./main.js"></script> <script src="./main.js"></script>
</body> </body>

@ -19,30 +19,30 @@
![Thirty Days Of JavaScript](../images/banners/day_1_2.png) ![Thirty Days Of JavaScript](../images/banners/day_1_2.png)
- [📔 Day 2](#-day-2) - [📔 Day 2](#-day-2)
- [Data Types](#data-types) - [Data Types](#data-types)
- [Primitive Data Types](#primitive-data-types) - [Primitive Data Types](#primitive-data-types)
- [Non-Primitive Data Types](#non-primitive-data-types) - [Non-Primitive Data Types](#non-primitive-data-types)
- [Numbers](#numbers) - [Numbers](#numbers)
- [Declaring Number Data Types](#declaring-number-data-types) - [Declaring Number Data Types](#declaring-number-data-types)
- [Math Object](#math-object) - [Math Object](#math-object)
- [Random Number Generator](#random-number-generator) - [Random Number Generator](#random-number-generator)
- [Strings](#strings) - [Strings](#strings)
- [String Concatenation](#string-concatenation) - [String Concatenation](#string-concatenation)
- [Concatenating Using Addition Operator](#concatenating-using-addition-operator) - [Concatenating Using Addition Operator](#concatenating-using-addition-operator)
- [Long Literal Strings](#long-literal-strings) - [Long Literal Strings](#long-literal-strings)
- [Escape Sequences in Strings](#escape-sequences-in-strings) - [Escape Sequences in Strings](#escape-sequences-in-strings)
- [Template Literals (Template Strings)](#template-literals-template-strings) - [Template Literals (Template Strings)](#template-literals-template-strings)
- [String Methods](#string-methods) - [String Methods](#string-methods)
- [Checking Data Types and Casting](#checking-data-types-and-casting) - [Checking Data Types and Casting](#checking-data-types-and-casting)
- [Checking Data Types](#checking-data-types) - [Checking Data Types](#checking-data-types)
- [Changing Data Type (Casting)](#changing-data-type-casting) - [Changing Data Type (Casting)](#changing-data-type-casting)
- [String to Int](#string-to-int) - [String to Int](#string-to-int)
- [String to Float](#string-to-float) - [String to Float](#string-to-float)
- [Float to Int](#float-to-int) - [Float to Int](#float-to-int)
- [💻 Day 2: Exercises](#-day-2-exercises) - [💻 Day 2: Exercises](#-day-2-exercises)
- [Exercise: Level 1](#exercise-level-1) - [Exercise: Level 1](#exercise-level-1)
- [Exercise: Level 2](#exercise-level-2) - [Exercise: Level 2](#exercise-level-2)
- [Exercises: Level 3](#exercises-level-3) - [Exercises: Level 3](#exercises-level-3)
# 📔 Day 2 # 📔 Day 2
@ -876,7 +876,7 @@ console.log(numFloat) // 9.81
let num = '9.81' let num = '9.81'
let numFloat = +num let numFloat = +num
console.log(numInt) // 9.81 console.log(numFloat) // 9.81
``` ```
#### Float to Int #### Float to Int

@ -18,38 +18,38 @@
![Thirty Days Of JavaScript](../images/banners/day_1_3.png) ![Thirty Days Of JavaScript](../images/banners/day_1_3.png)
- [📔 Day 3](#-day-3) - [📔 Day 3](#-day-3)
- [Booleans](#booleans) - [Booleans](#booleans)
- [Truthy values](#truthy-values) - [Truthy values](#truthy-values)
- [Falsy values](#falsy-values) - [Falsy values](#falsy-values)
- [Undefined](#undefined) - [Undefined](#undefined)
- [Null](#null) - [Null](#null)
- [Operators](#operators) - [Operators](#operators)
- [Assignment operators](#assignment-operators) - [Assignment operators](#assignment-operators)
- [Arithmetic Operators](#arithmetic-operators) - [Arithmetic Operators](#arithmetic-operators)
- [Comparison Operators](#comparison-operators) - [Comparison Operators](#comparison-operators)
- [Logical Operators](#logical-operators) - [Logical Operators](#logical-operators)
- [Increment Operator](#increment-operator) - [Increment Operator](#increment-operator)
- [Decrement Operator](#decrement-operator) - [Decrement Operator](#decrement-operator)
- [Ternary Operators](#ternary-operators) - [Ternary Operators](#ternary-operators)
- [Operator Precendence](#operator-precendence) - [Operator Precendence](#operator-precendence)
- [Window Methods](#window-methods) - [Window Methods](#window-methods)
- [Window alert() method](#window-alert-method) - [Window alert() method](#window-alert-method)
- [Window prompt() method](#window-prompt-method) - [Window prompt() method](#window-prompt-method)
- [Window confirm() method](#window-confirm-method) - [Window confirm() method](#window-confirm-method)
- [Date Object](#date-object) - [Date Object](#date-object)
- [Creating a time object](#creating-a-time-object) - [Creating a time object](#creating-a-time-object)
- [Getting full year](#getting-full-year) - [Getting full year](#getting-full-year)
- [Getting month](#getting-month) - [Getting month](#getting-month)
- [Getting date](#getting-date) - [Getting date](#getting-date)
- [Getting day](#getting-day) - [Getting day](#getting-day)
- [Getting hours](#getting-hours) - [Getting hours](#getting-hours)
- [Getting minutes](#getting-minutes) - [Getting minutes](#getting-minutes)
- [Getting seconds](#getting-seconds) - [Getting seconds](#getting-seconds)
- [Getting time](#getting-time) - [Getting time](#getting-time)
- [💻 Day 3: Exercises](#-day-3-exercises) - [💻 Day 3: Exercises](#-day-3-exercises)
- [Exercises: Level 1](#exercises-level-1) - [Exercises: Level 1](#exercises-level-1)
- [Exercises: Level 2](#exercises-level-2) - [Exercises: Level 2](#exercises-level-2)
- [Exercises: Level 3](#exercises-level-3) - [Exercises: Level 3](#exercises-level-3)
# 📔 Day 3 # 📔 Day 3
@ -218,7 +218,7 @@ console.log('python'.length > 'dragon'.length) // false
``` ```
Try to understand the above comparisons with some logic. Remembering without any logic might be difficult. Try to understand the above comparisons with some logic. Remembering without any logic might be difficult.
JavaScript is some how a wired kind of programming language. JavaScript code run and give you a result but unless you are good at it may not be the desired result. JavaScript is somehow a wired kind of programming language. JavaScript code run and give you a result but unless you are good at it may not be the desired result.
As rule of thumb, if a value is not true with == it will not be equal with ===. Using === is safer than using ==. The following [link](https://dorey.github.io/JavaScript-Equality-Table/) has an exhaustive list of comparison of data types. As rule of thumb, if a value is not true with == it will not be equal with ===. Using === is safer than using ==. The following [link](https://dorey.github.io/JavaScript-Equality-Table/) has an exhaustive list of comparison of data types.
@ -254,7 +254,7 @@ let isMarried = !false // true
### Increment Operator ### Increment Operator
In JavaScrip we use the increment operator to increase a value stored in a variable. The increment could be pre or post increment. Let us see each of them: In JavaScript we use the increment operator to increase a value stored in a variable. The increment could be pre or post increment. Let us see each of them:
1. Pre-increment 1. Pre-increment
@ -276,7 +276,7 @@ We use most of the time post-increment. At least you should remember how to use
### Decrement Operator ### Decrement Operator
In JavaScrip we use the decrement operator to decrease a value stored in a variable. The decrement could be pre or post decrement. Let us see each of them: In JavaScript we use the decrement operator to decrease a value stored in a variable. The decrement could be pre or post decrement. Let us see each of them:
1. Pre-decrement 1. Pre-decrement

@ -18,16 +18,16 @@
![Thirty Days Of JavaScript](../images/banners/day_1_4.png) ![Thirty Days Of JavaScript](../images/banners/day_1_4.png)
- [📔 Day 4](#-day-4) - [📔 Day 4](#-day-4)
- [Conditionals](#conditionals) - [Conditionals](#conditionals)
- [If](#if) - [If](#if)
- [If Else](#if-else) - [If Else](#if-else)
- [If Else if Else](#if-else-if-else) - [If Else if Else](#if--else-if-else)
- [Switch](#switch) - [Switch](#switch)
- [Ternary Operators](#ternary-operators) - [Ternary Operators](#ternary-operators)
- [💻 Exercises](#-exercises) - [💻 Exercises](#-exercises)
- [Exercises: Level 1](#exercises-level-1) - [Exercises: Level 1](#exercises-level-1)
- [Exercises: Level 2](#exercises-level-2) - [Exercises: Level 2](#exercises-level-2)
- [Exercises: Level 3](#exercises-level-3) - [Exercises: Level 3](#exercises-level-3)
# 📔 Day 4 # 📔 Day 4
@ -189,7 +189,8 @@ switch(caseValue){
// code // code
break break
case 3: case 3:
// code // code
break
default: default:
// code // code
} }

@ -390,7 +390,7 @@ _every_: Check if all the elements are similar in one aspect. It returns boolean
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook'] const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const areAllStr = names.every((name) => typeof name === 'string') // Are all strings? const areAllStr = names.every((name) => typeof name === 'string') // Are all strings?
console.log(arrAllStr) console.log(areAllStr)
``` ```
```sh ```sh

@ -18,29 +18,29 @@
![Thirty Days Of JavaScript](../images/banners/day_1_12.png) ![Thirty Days Of JavaScript](../images/banners/day_1_12.png)
- [📘 Day 12](#-day-12) - [📘 Day 12](#-day-12)
- [Regular Expressions](#regular-expressions) - [Regular Expressions](#regular-expressions)
- [RegExp parameters](#regexp-parameters) - [RegExp parameters](#regexp-parameters)
- [Pattern](#pattern) - [Pattern](#pattern)
- [Flags](#flags) - [Flags](#flags)
- [Creating a pattern with RegExp Constructor](#creating-a-pattern-with-regexp-constructor) - [Creating a pattern with RegExp Constructor](#creating-a-pattern-with-regexp-constructor)
- [Creating a pattern without RegExp Constructor](#creating-a-pattern-without-regexp-constructor) - [Creating a pattern without RegExp Constructor](#creating-a-pattern-without-regexp-constructor)
- [RegExpp Object Methods](#regexpp-object-methods) - [RegExpp Object Methods](#regexpp-object-methods)
- [Testing for a match](#testing-for-a-match) - [Testing for a match](#testing-for--a-match)
- [Array containing all of the match](#array-containing-all-of-the-match) - [Array containing all of the match](#array-containing-all-of-the-match)
- [Replacing a substring](#replacing-a-substring) - [Replacing a substring](#replacing-a-substring)
- [Square Bracket](#square-bracket) - [Square Bracket](#square-bracket)
- [Escape character(\\) in RegExp](#escape-character-in-regexp) - [Escape character(\\) in RegExp](#escape-character-in-regexp)
- [One or more times(+)](#one-or-more-times) - [One or more times(+)](#one-or-more-times)
- [Period(.)](#period) - [Period(.)](#period)
- [Zero or more times(*)](#zero-or-more-times) - [Zero or more times(*)](#zero-or-more-times)
- [Zero or one times(?)](#zero-or-one-times) - [Zero or one times(?)](#zero-or-one-times)
- [Quantifier in RegExp](#quantifier-in-regexp) - [Quantifier in RegExp](#quantifier-in-regexp)
- [Cart ^](#cart-) - [Cart ^](#cart-)
- [Exact match](#exact-match) - [Exact match](#exact-match)
- [💻 Exercises](#-exercises) - [💻 Exercises](#-exercises)
- [Exercises: Level 1](#exercises-level-1) - [Exercises: Level 1](#exercises-level-1)
- [Exercises: Level 2](#exercises-level-2) - [Exercises: Level 2](#exercises-level-2)
- [Exercises: Level 3](#exercises-level-3) - [Exercises: Level 3](#exercises-level-3)
# 📘 Day 12 # 📘 Day 12
@ -503,22 +503,19 @@ distance = 12
```js ```js
sentence = `%I $am@% a %tea@cher%, &and& I lo%#ve %tea@ching%;. There $is nothing; &as& mo@re rewarding as educa@ting &and& @emp%o@wering peo@ple. ;I found tea@ching m%o@re interesting tha@n any other %jo@bs. %Do@es thi%s mo@tivate yo@u to be a tea@cher!?` sentence = `%I $am@% a %tea@cher%, &and& I lo%#ve %tea@ching%;. There $is nothing; &as& mo@re rewarding as educa@ting &and& @emp%o@wering peo@ple. ;I found tea@ching m%o@re interesting tha@n any other %jo@bs. %Do@es thi%s mo@tivate yo@u to be a tea@cher!?`
console.log(cleanText(sentence))
console.log(cleanText(sentence))
``` ```
```sh ```sh
I am a teacher and I love teaching There is nothing as more rewarding as educating and empowering people I found teaching more interesting than any other jobs Does this motivate you to be a teacher I am a teacher and I love teaching There is nothing as more rewarding as educating and empowering people I found teaching more interesting than any other jobs Does this motivate you to be a teacher
``` ```
1. Write a function which find the most frequent words. After cleaning, count three most frequent words in the string. 2. Write a function which find the most frequent words. After cleaning, count three most frequent words in the string.
```js ```js
console.log(mostFrequentWords(cleanedText)) console.log(mostFrequentWords(cleanedText))
[{word:'I', count:3}, {word:'teaching', count:2}, {word:'teacher', count:2}] [{word:'I', count:3}, {word:'teaching', count:2}, {word:'teacher', count:2}]
``` ```
🎉 CONGRATULATIONS ! 🎉 🎉 CONGRATULATIONS ! 🎉
[<< Day 11](../11_Day_Destructuring_and_spreading/11_day_destructuring_and_spreading.md) | [Day 13 >>](../13_Day_Console_object_methods/13_day_console_object_methods.md)
[<< Day 11](../11_Day_Destructuring_and_spreading/11_day_destructuring_and_spreading.md) | [Day 13>>](../13_Day_Console_object_methods/13_day_console_object_methods.md)

@ -19,22 +19,22 @@
![Thirty Days Of JavaScript](../images/banners/day_1_15.png) ![Thirty Days Of JavaScript](../images/banners/day_1_15.png)
- [Day 15](#day-15) - [Day 15](#day-15)
- [Classes](#classes) - [Classes](#classes)
- [Defining a classes](#defining-a-classes) - [Defining a classes](#defining-a-classes)
- [Class Instantiation](#class-instantiation) - [Class Instantiation](#class-instantiation)
- [Class Constructor](#class-constructor) - [Class Constructor](#class-constructor)
- [Default values with constructor](#default-values-with-constructor) - [Default values with constructor](#default-values-with-constructor)
- [Class methods](#class-methods) - [Class methods](#class-methods)
- [Properties with initial value](#properties-with-initial-value) - [Properties with initial value](#properties-with-initial-value)
- [getter](#getter) - [getter](#getter)
- [setter](#setter) - [setter](#setter)
- [Static method](#static-method) - [Static method](#static-method)
- [Inheritance](#inheritance) - [Inheritance](#inheritance)
- [Overriding methods](#overriding-methods) - [Overriding methods](#overriding-methods)
- [Exercises](#exercises) - [Exercises](#exercises)
- [Exercises Level 1](#exercises-level-1) - [Exercises Level 1](#exercises-level-1)
- [Exercises Level 2](#exercises-level-2) - [Exercises Level 2](#exercises-level-2)
- [Exercises Level 3](#exercises-level-3) - [Exercises Level 3](#exercises-level-3)
# Day 15 # Day 15
@ -111,7 +111,7 @@ console.log(person)
``` ```
```sh ```sh
Person {firstName: undefined, lastName} Person {firstName: undefined, lastName:undefined}
``` ```
All the keys of the object are undefined. When ever we instantiate we should pass the value of the properties. Let us pass value at this time when we instantiate the class. All the keys of the object are undefined. When ever we instantiate we should pass the value of the properties. Let us pass value at this time when we instantiate the class.

@ -19,15 +19,15 @@
![Thirty Days Of JavaScript](../images/banners/day_1_18.png) ![Thirty Days Of JavaScript](../images/banners/day_1_18.png)
- [Day 18](#day-18) - [Day 18](#day-18)
- [Promise](#promise) - [Promise](#promise)
- [Callbacks](#callbacks) - [Callbacks](#callbacks)
- [Promise constructor](#promise-constructor) - [Promise constructor](#promise-constructor)
- [Fetch API](#fetch-api) - [Fetch API](#fetch-api)
- [Async and Await](#async-and-await) - [Async and Await](#async-and-await)
- [Exercises](#exercises) - [Exercises](#exercises)
- [Exercises: Level 1](#exercises-level-1) - [Exercises: Level 1](#exercises-level-1)
- [Exercises: Level 2](#exercises-level-2) - [Exercises: Level 2](#exercises-level-2)
- [Exercises: Level 3](#exercises-level-3) - [Exercises: Level 3](#exercises-level-3)
# Day 18 # Day 18
@ -147,7 +147,7 @@ Let us another example when the promise is settled with reject.
const doPromise = new Promise((resolve, reject) => { const doPromise = new Promise((resolve, reject) => {
setTimeout(() => { setTimeout(() => {
const skills = ['HTML', 'CSS', 'JS'] const skills = ['HTML', 'CSS', 'JS']
if (skills.icludes('Node')) { if (skills.includes('Node')) {
resolve('fullstack developer') resolve('fullstack developer')
} else { } else {
reject('Something wrong has happened') reject('Something wrong has happened')

@ -74,7 +74,7 @@ We can access already created element or elements using JavaScript. To access or
#### Getting elements by tag name #### Getting elements by tag name
**_getElementsByTagName()_**:takes a take name as a string parameter and this method returns an HTMLCollection object. An HTMLCollection is an array like object of HTML elements. The length property provides the size of the collection. Whenever we use this method we access the individual elements using index or after loop through each individual items. An HTMLCollection does not support all array methods therefore we should use regular for loop instead of forEach. **_getElementsByTagName()_**:takes a tag name as a string parameter and this method returns an HTMLCollection object. An HTMLCollection is an array like object of HTML elements. The length property provides the size of the collection. Whenever we use this method we access the individual elements using index or after loop through each individual items. An HTMLCollection does not support all array methods therefore we should use regular for loop instead of forEach.
```js ```js
// syntax // syntax

@ -240,7 +240,7 @@ This is a multiline comment
##### Syntax ##### Syntax
Programming languages are similar to human languages. English or many other language uses words, phrases, sentences,compound sentences and other more to convey a meaningful message. The English meaning of syntax is _the arrangement of words and phrases to create well-formed sentences in a language_. The technical definition of syntax is the structure of statements in a computer language.Programming languages have syntax. JavaScript is a programming language and like other programming languages it has its own syntax. If we do not write a syntax that JavaScript understands, it will raise different types of errors. We will explore different kinds of JavaScript errors later. For now, let us see syntax errors. Programming languages are similar to human languages. English or many other language uses words, phrases, sentences, compound sentences and other more to convey a meaningful message. The English meaning of syntax is _the arrangement of words and phrases to create well-formed sentences in a language_. The technical definition of syntax is the structure of statements in a computer language. Programming languages have syntax. JavaScript is a programming language and like other programming languages it has its own syntax. If we do not write a syntax that JavaScript understands, it will raise different types of errors. We will explore different kinds of JavaScript errors later. For now, let us see syntax errors.
![Error](images/raising_syntax_error.png) ![Error](images/raising_syntax_error.png)

Loading…
Cancel
Save