Find the Average of a Given Array of Numbers

Dooder — Tue, 28 Jun 2022 23:07:11 +0000

Find the average of all numbers in a given array

Let's say we wanted to write a function that calculates the average of all grades (including yours). We can do this in many different ways in JavaScript, but in this demo I will be showing you how to find the average using Higher-Order Functions and the "for" loop.

forEach loop

The forEach() method executes a provided function once for each array element.

const yourGrade = 88;
let classGrades = [
    87, 68, 94, 100, 83,
    78, 85, 91, 76, 87
];

// push `yourGrade` to the end of classGrades
classGrades.push(yourGrade);
console.log(classGrades);

function average(array) {
  // initialize value of `sum`
  let sum = 0;
  // capture the length of the array
  let arrayLength = array.length;
  // loop through the array via forEach
  array.forEach((grade) => {
    return (sum += grade);
  });
  // formula to calculate average: sum / arrayLength
  return Math.round(sum / arrayLength);
}
const avg = average(classGrades);
console.log(avg);

for loop

The for() loop iterates a specified amount of times, and does "something" that many times.

const yourGrade = 88;
let classGrades = [
    87, 68, 94, 100, 83,
    78, 85, 91, 76, 87
];

console.log(classGrades);

function average(array) {
  // initialize value of `sum`
  let sum = 0;
  // capture the length of the array
  let arrayLength = array.length;
  // iterate over the array
  for (let i = 0; i < array.length; i++) {
    // add each element to the `sum`
    sum += array[i];
  }
  // formula to calculate average: sum / arrayLength
  /* since we are not pushing our grade to the array
   using `array.push()`, we need to do a little bit of algebra
   to add ourselves to the list */
  return Math.round((sum + yourGrade) / (arrayLength + 1));
}
const avg = average(classGrades);
console.log(avg);

reduce

The reduce() method is quite similar to the forEach() method, but requires a lot less coding. :)

const yourGrade = 88;
let classGrades = [
    87, 68, 94, 100, 83,
    78, 85, 91, 76, 87
];

// push `yourGrade` to the end of classGrades
classGrades.push(yourGrade);
console.log(classGrades);

function average(array) {
    // action to do for every value
  const avg =
    array.reduce((previousValue, currentValue) =>
    previousValue + currentValue) / array.length;
  return Math.round(avg);
}
const avg = average(classGrades);
console.log(avg);

Make VSCode Home With These Extensions

Dooder — Thu, 23 Jun 2022 07:52:05 +0000

Getting started with Visual Studio Code and/or looking for some new plugins to fit seamlessly with your workflow? Well, look no further! Below, I have included some of the most useful and recommended extensions that are completely free to install and use.

Theme/Icons

Current theme:
- GitHub Dark Mode ♥️
Icons:
- Material Icon Theme
Font:
- Fira Code

Workflow

Auto Close Tag
- Automatically add HTML/XML close tag
Auto Rename Tag
- Automatically rename paired HTML/XML tag
Foam Research
- note-taking tool that lives within VS Code, which means you can pair it with your favorite extensions for a great editing experience.
Better Comments
- Comments extension will help you create more human-friendly comments in your code.
CodeSwing
- It's like having the magic of a traditional web playground (e.g. CodePen, JSFiddle), but available directly from your highly-personalized editor.
Code Runner
- Run code snippet or code file for multiple languages: C, C++, Java, JavaScript, PHP, Python, Perl, e.c.t.
advanced-new-file
- Create files anywhere in your workspace from the keyboard
Error Lens
- Error Lens turbo-charges language diagnostic features
ESDoc MDN
- This extension lets you quickly bring up helpful MDN documentation in the editor by typing //mdn [object.property]; for example.
Live Preview
- Hosts a local server in your workspace for you to preview your webpages on in VSC!
HTML CSS Support
- HTML id and class attribute completion for Visual Studio Code.
JavaScript (ES6) code snippets
- Code snippets for JavaScript in ES6 syntax (ex: clg + tab -> console.log())
Todo Tree
- Show TODO, FIXME, etc. comment tags in a tree view
Magick Image Reader
- Uses ImageMagick to add read-only views of over 100 image formats in Visual Studio Code.

GitHub

Gist
- Access your GitHub Gists within Visual Studio Code.
GistPad
- GistPad is a Visual Studio Code extension that allows you to edit GitHub Gists and repositories from the comfort of your favorite editor
Git History
- View git log, file history, compare branches or commits
gitignore
- Lets you pull .gitignore templates from https://github.com/github/gitignore
GitLens
- Supercharge Git within VS Code
Open in GitHub, Bitbucket, Gitlab, VisualStudio.com
- Open in GitHub, Bitbucket, Gitlab, VisualStudio.com

Style/Formatting

ESLint
- Integrates ESLint JS
Prettier
- Automatically format javascript, JSON, CSS, Sass, and HTML files.
Color Highlight
- This extension styles css/web colors found in your document.

Useful/Extra

Import Cost
- Display inline the size of the required/imported package
VS Live Share
- Collaborative editing, debugging, and more inside VS Code
npm Intellisense
- Autocompletes npm modules in import/require statements
Path Intellisense
- Autocompletes filenames
Image Preview
- Shows image preview in the gutter and on hover
FontSize ShortCuts
- Change the font size with keyboard shortcuts.
WakaTime
- Metrics, insights, and time tracking automatically generated from your programming activity.
indent-rainbow
- Makes indentation easier to read
Discord Rich Presence
- Show what you're working on in Discord!
Lorem ipsum
- A tiny VS Code extension made up of a few commands that generate and insert lorem ipsum text into a text file.
vscode-faker
- Generate fake data for name, address, lorem ipsum, commerce and much more

See my full list of extensions here

Forem: Dooder