> For the complete documentation index, see [llms.txt](https://mentorship101.gitbook.io/mentorship-101/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mentorship101.gitbook.io/mentorship-101/javascript.md).

# JavaScript

{% hint style="info" %}
Make sure you have gone through[ General programming](https://mentorship101.gitbook.io/mentorship-101/general-programming), this will be a more advanced.
{% endhint %}

## What's JavaScript?

Also known as EcmaScript. It's major aim is to allow users interact with HTML elements. It majorly allows page interactivity.

**Example** If you click on button, you would require to view confirmation dialog and accept yes or no. Also for form inputs, you need to validate user inputs like strong passwords can be validated in JavaScript.

{% hint style="info" %}
\<script> tags are used to enclose javascript codes
{% endhint %}

## JavaScript in HTML

Just like Css in HTML, there are three ways of adding javascript in HTML:

1. Embedded Scripts
2. External file scripts

{% code title="index.html" %}

```
//Embedded Scripts
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Javscript</title>
    <script>
    function BtnClick() {
        alert('been clicked');
    }
    </script>
</head>
<body>
    <button onclick="BtnClick()">Javascript is cool</button>
</body>
</html>
```

{% endcode %}

{% code title="external.html" %}

```
//External file scripts
// index.html file
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Javscript</title>
    <script src="script.js"></script>
</head>
<body>
    <button onclick="ExternalClick()">External file</button>
</body>
</html>


// script.js file
function ExternalClick() {
    alert('am an external file clicked');
}
```

{% endcode %}

### Note

The button in both codes above has an event `onClick` that recognises the button has been clicked by a user and issues an alert dialog box.

What You Will Learn

* [ ] Basic javascript in a simple project
* [ ] JavaScript OOP
* [ ] Objects and prototypes
* [ ] Promises
* [ ] Requests
* [ ] ES6

`Let's give users freedom`&#x20;
