-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathTechnical-Blog-JS-Fundamentals.html
51 lines (45 loc) · 4.35 KB
/
Technical-Blog-JS-Fundamentals.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!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">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Genos:ital,wght@1,300&display=swap" rel="stylesheet">
<link href="main.css" rel="stylesheet" type="text/css">
<title>HTML Template</title>
</head>
<body>
<h1>Technical Blog - Javascript Fundamentals</h1>
<h2>Difference between HTML and CSS:</h2>
<p>
HTML holds information that shapes the content of a website. It controls the texts, titles, links and images that could be seen on the page. The file name is generally index.html and the content is organised by tags.
CSS stands for Cascading Style Sheet and controls the front end information of a website. It consists of colour, spacing, font, size, image and text placement ect. The commands in CSS is executed by referencing the tags in the HTML file.
</p>
<h2>Control flow and loops:</h2>
<p>
Control flow is an order where the computer runs code from top to bottom. A loop can interfere with this order by looping the statement and making the code run again with conditions and functions.
A loop generally consist of an iterator: (how many times of looping), a condition: (the limit of the loops), and
cycle complete: (what happens after the loops).
Control flow is like the instructions for ordering a cake online, you must call the cake store, they take the order and then you give them details and pay them and then your cake will be delivered. Loop is when you decide you want more cake so you follow up with more orders and so the process will be repeated again and again at the ordering, payment and delivery stage so they make more cake for you, with a limit and certain conditions. For example they could run out of cake or you run out of money or they finish for the day.
</p>
<h2>DOM and how to interact with it:</h2>
<p>
DOM stands for Document Object Model and it can be accessed by right clicking a webpage and selecting ‘inspect’ or command + option + I. It opens as a little side page positioned around, above or below the original webpage and tells you in a tree structure what is programmed inside. You can change things in the DOM and see it take place in the webpage but it’s only temporary and in your device. For example you can open each tag in the tree and edit them or you can select the arrow in the corner and hover over the webpage and the corresponding codes will be highlighted in the DOM.
</p>
<h2>The difference between accessing data from arrays and objects:</h2>
<p>
An object is used to store a collection of information. The three common ways to access data from an object is
-Dot property accessor: object. property. -Square brackets property access: object['property']
-Object destructuring: const { property } = object.
An array is a list of information inside square brackets, placed in a special order that can be accessed by identifying the placement. The placement order also known as the index is always 0, 1, 2, 3, 4, and so on. When you specify the index number within the array, it accesses the corresponding data.
</p>
<h2>What are functions and why are they useful:</h2>
<p>
A function is like a procedure where a task is carried out. It should take some input and return an output which can be codes, statements or numbers depending on the function.
Every function is an object. An object is a collection of key:value pairs. If a value is a primitive (number, string, boolean), or another object, the value is considered a property. If a value is a function, it is called a 'method'
Functions are useful because they can carry out commands and deal with lots of data at once. For example the map() function can convert all the items in an array to form a new array. The filter() function can filter through items and return the ones that fit the criteria.
</p>
</body>
</html>