Obtain the top 3 values from a JavaScript dictionary

I'm trying to find a way to get the top 3 keys from a dictionary like this:

dict = {"apple": 1, "orange":10,"watermelon":5, "banana":15}
. Any ideas on how I can achieve this?

// Expected output: ["banana","orange", "watermelon"]

Answer №1

Utilize the Object.entries method along with destructuring to efficiently arrange in order, extract top 3 elements from the sorted entries array, then use map to generate an array consisting of fruit names:

const dict = {"apple": 1, "orange":10,"watermelon":5, "banana":15};
const top3 = Object
  .entries(dict) // convert into Array of Arrays [key, value]
  .sort(([, a],[, b]) => b-a) // sort by value in descending order
  .slice(0,3) // select only the first 3 elements from the sorted list
  .map(([n])=> n); // map it to an array containing only the name

console.log(top3);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Can you identify the issue with this particular JSON parsing function's reviver?

I am trying to parse a JSON string with a reviver function to only include specific properties. Here is my code snippet: const whitelist = ['prop1', 'prop2', 'result']; const reviver = (key, value) => { if (whitelist.i ...

Is it possible to integrate the screenfull JavaScript library into the Next.js framework?

Attempting to utilize Dynamic Importing in Nextjs for incorporating the screenfull library has proven unsuccessful. import dynamic from "next/dynamic" import screenfull from 'screenfull'; const Screenfull = dynamic(()=>{return import ...

A guide to using select2.js to activate a selection based on a data attribute

I'm faced with the following html snippet: <div class='multiWrapper'> <select id="multi" class="js-dropdown-from-code"> <optgroup class='def-cursor' label='Code' data-city ...

Transferring blank documents to a React-Native server

When attempting to send JSON files to the server using NodeJS with multer, I am running into an issue where the files are being sent empty. Currently, I am utilizing React-native-File-System to iterate through all the files located in the specified folder ...

Problem with Resetting State in Cordova/AngularJS

Currently, I am facing a challenge with my Cordova/AngularJS mobile application as I struggle to refresh the current state with new data. Please be aware that this is not an Ionic Framework application. The issue arises in the part of my app where I need ...

Unveiling the power of Axios and Vue in fetching API data: The quest for

I've encountered a problem while trying to integrate my API with Vue/Axios. The issue arises when I attempt to store the data retrieved by Axios into an empty variable within the data object of my component. It throws an "undefined at eval" error. Can ...

Postman is showing a 404 error message when trying to access an Express JS route that uses a POST request

Currently, I am working on creating APIs in Node.js with express and body-parser. While GET requests work fine using Postman, there seems to be an issue with POST requests as it consistently throws a 404 error saying Cannot GET / Express Version: @4.17.1 ...

What is the best method for rotating segments in THREE.TubeGeometry?

I've successfully generated a flat tube structure using THREE.TubeGeometry with radiusSegments set to 2. However, once added to the scene, it appears perpendicular to the ground: https://i.sstatic.net/U3qTt.png Is there a way to rotate each segment ...

Arrange JSON elements in ascending order within a for loop before displaying them according to a specific value

I've been dedicating myself to learning JavaScript for the past month, and I'm currently working on a web page project for educational purposes. However, I've hit a roadblock when it comes to displaying data based on the top 10% and bottom 1 ...

Removing items from an array in Angular when a checkbox is checked

I'm looking to iterate through a checklist and remove completed items from the array. Here's my current code: app.controller("MainController", ["$scope",function($scope) { $scope.list = [{ text: 'Figure your stuff out', done: ...

What is the process of caching images when they are loaded through a php script?

My PHP script acts as a random image generator by querying the database for user images and returning a random one. Below is the code snippet responsible for serving the randomly chosen image. header('Content-Transfer-Encoding: binary'); header( ...

Apply a class to a div once another class with animation has been applied

Recently, I created a button that triggers the addition of a class with animation to an image upon clicking. Now, I am trying to make another button add a different class to revert the image back to its original size. However, the second class doesn't ...

Exploring the elements in a JavaScript array

Currently, I am working on a project that involves a website where users can upload .csv files for processing. The main goal is to extract the data from the uploaded file and compare it with the existing file on the website using JavaScript. My challenge l ...

jquery success json ajax datatype

$.ajax({ url: '../ajax/deletestudent.php', type: 'POST', dataType: "json", data: formData, processData: false, // instruct jQuery not to process the data contentType: false, // instruct jQuery not to set contentT ...

Revamp the current webpage to display attribute values in textual format

As I peruse a webpage, I notice that there is room for improvement in terms of user-friendliness. The page is filled with a list of movie titles, each accompanied by a link to IMDb. However, the IMDB user rating is only visible when hovering over the titl ...

Vanilla JavaScript MVC - Send notification to controller from model upon successful AJAX completion

I am facing some challenges with my first vanilla JS MVC app. When my model sends an AJAX request to the server, the controller updates the view before waiting for the promise to resolve, resulting in an empty update on the view. How can I inform the contr ...

Ways to eliminate the Vuetify append-icon from the sequential keyboard navigation

In my Vue.js application using Vuetify, I have implemented a series of password fields using v-text-field with an append-icon to toggle text visibility. Here is the code snippet: <v-text-field v-model="password" :append-icon="show1 ? 'mdi-eye& ...

Converting an array containing objects from JavaScript to PHP for database insertion

Hey, I'm dealing with an array that contains objects, and it's structured like this: https://i.sstatic.net/48gMT.png I want to insert this data into my database using an AJAX call to my PHP file. I've attempted to use JSON.stringify on th ...

Integrating a footer into the enhanced search tab slider

I'm struggling to create a sticky footer like the one on w3schools. Even though I used the same code in my material UI demo, it's not functioning properly. I tried debugging by changing the position from fixed to absolute, but it still isn&apos ...

Preserving color output while executing commands in NodeJS

My Grunt task involves shelling out via node to run "composer install". var done = this.async(); var exec = require('child_process').exec; var composer = exec( 'php bin/composer.phar install', function(error, stdout, stderr) { ...