When dealing with back-end data in JavaScript, converting long types can result in a

When parsing data of the Object type in C#, utilizing JavaScript on the front end to parse the data can result in loss of precision.

<!DOCTYPE html>
<html>
<head>
  <title>Example using BigNumber.js</title>
  <script src="https://cdn.jsdelivr.net/npm/bignumber.js/bignumber.min.js"></script>
</head>
<body>
  <script>
    const jsonStr = '{"total": 8, "items": [{ "userId": "601d1b35-0221-427b-b3f9-b0f8a884a043", "startWay": 0, "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "adc5ef31-a122-4868-a0a8-226712546a86", "creationTime": "2023-07-25T10:00:07+08:00", "eventName": "TaskStarted" }, { "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "5043873d-bdd3-43f8-881b-958cb4759e74", "creationTime": "2023-07-25T10:00:08+08:00", "eventName": "TaskSplitStarted" }, { "subTasks": [{ "subTaskId": "0d54fb77-3705-43ab-85cf-07804af8ebc5", "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "dispatchNo": "4baf8ff6-58e3-4d56-9ddd-8f4e3057c98a", "sequence": 1, "cloudId": "cb656221-d900-43b2-adfd-78610f72e4bb", "clusterId": "b05fdf6a-f6c8-4a72-9083-eb3cf7494f90", "clusterGroup": 95, "status": 4, "resendCount": 0, "createdTime": "2023-07-25T10:00:08+08:00", "sentTime": "2023-07-25T10:00:11+08:00", "startTime": "2023-07-25T10:00:13+08:00", "endTime": "2023-07-25T10:00:48+08:00", "executeSeconds": 35, "isEnded": true }] }, { "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "ad407d3c-4a89-4ecb-a6b9-9b3cdf5bfee9", "creationTime": "2023-07-25T10:00:08+08:00", "eventName": "SubTasksCreated" }, { "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "260ba91f-091d-4b7b-945d-f1d1ea0c411e", "creationTime": "2023-07-25T10:00:08+08:00", "eventName": "TaskSplitFinished" }, { "subTaskId": "0d54fb77-3705-43ab-85cf-07804af8ebc5", "clusterGroup": 95, "sequence": 1, "dispatchNo": "4baf8ff6-58e3-4d56-9ddd-8f4e3057c98a", "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "0d21fcfb-a8c1-478f-ab64-55ba8899c53c", "creationTime": "2023-07-25T10:00:11+08:00", "eventName": "SubTaskSent" }, { "subTaskId": "0d54fb77-3705-43ab-85cf-07804af8ebc5", "sequence": 1, "cloudId": "cb656221-d900-43b2-adfd-78610f72e4bb", "clusterId": "b05fdf6a-f6c8-4a72-9083-eb3cf7494f90", "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "78f7e094-ad76-4b51-93b6-dfbbe496b9e5", "creationTime": "2023-07-25T10:00:13+08:00", "eventName": "SubTaskExecuted" }, { "subTaskId": "0d54fb77-3705-43ab-85cf-07804af8ebc5", "sequence": 1, "cloudId": "cb656221-d900-43b2-adfd-78610f72e4bb", "clusterId": "b05fdf6a-f6c8-4a72-9083-eb3cf7494f90", "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "f15cf411-4882-4cb1-80a7-11df3f0fed38", "creationTime": "2023-07-25T10:00:48+08:00", "eventName": "SubTaskFinished" }, { "taskId": "6b41c1eb-32a4-45a5-9937-47d4bd24471c", "lotNo": 638258760079874090, "id": "c3c7312a-4315-4dd9-801e-8a156f85514c", "creationTime": "2023-07-25T10:00:48+08:00", "eventName": "TaskFinished" }]}';
    const jsonObj = JSON.parse(jsonStr, (key, value) => {
      if (key === 'lotNo') {
        return new BigNumber(value);
      }
      return value;
    });
    console.log(jsonObj.items[0].lotNo.toString()); // Output: 638258760079874090
  </script>
</body>
</html>

https://i.sstatic.net/CA9ww.jpg

Answer №1

In order to send the lot number over to the JavaScript side, make sure to convert the number to a string in C#. This can make it easier to handle identifiers as strings, especially if you don't need to store them in a database or perform arithmetic operations on them.

It's important to note that JavaScript doesn't support 64-bit integers; it treats all numbers as 64-bit floating point values, which have a limited precision of only 53 bits. This may not be enough to accurately represent your value.

If precision is crucial, consider using BigInt, which allows for expressing arbitrarily large integers.

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

What is the process for triggering property decorators during runtime?

Wondering about dynamically invoking a property decorator at runtime. If we take a look at the code snippet below: function PropertyDecorator( target: Object, // The prototype of the class propertyKey: string | symbol // The name of th ...

Replacing a push operation in JavaScript with a splice operation

Upon entering a screen, 5 promises are automatically loaded using promise.all. The issue is that they are executed in a random order, and within each function, I use a push to store the information. The problem arises when I need to change the push to a s ...

When the user hits the enter key, automatically submit a form without the need for

Is it possible to submit a form on enter using type="button"? Here are my input fields: <input type="text" id = "login-user" class="form-control log-input" placeholder="Username" required="required"> <input type="password" id="login-password" clas ...

What is the best way to adjust the width of a formula field in a Crystal Report dynamically?

In my web application, I am dynamically loading Crystal Reports to display only columns with non-null rows. The parameter values will be set during runtime. The report design will eventually look like this param1 param2 param 3 param4 @formu ...

Are the shadows in the scene being affected by a problem between DirectionalLightHelper and CameraHelper?

Currently, I am working on a complex static render in the browser using three.js and I have encountered an issue while trying to produce accurate shadows with a single THREE.DirectionalLight that represents the sun in my scene. All the geometry in another ...

Incorporate ng-click as an attribute in AngularJS

Is there a way to include ng-click as an attribute? For example, imagine I want to add ng-click if my <li> has the class someClass: angular.element(root.querySelector('li.someClass').attr({'ng-click': 'someFunc()'}); ...

Having trouble with either posting a JSON using $.ajax() or reading it using PHP?

I'm struggling to identify the issue at hand. Here's my JavaScript function for sending JSON data: function send(var1, var2) { var result; att = window.location; $.ajax({ 'crossDomain': true, 'type&apos ...

Modify the HTML select tag to toggle from a selected checkbox

What should I do when a certain option is checked in the checkbox, and that label needs to be shown in the select tag? https://i.stack.imgur.com/ZxRNF.png Checkbox input <input type="checkbox" class="toggle-product pull-right" @if(!isset($restrictedPr ...

Maintaining Changes in Javascript and CSS

I have created a header that can slide in and out of view with a toggle function. However, I want the header to be in the down position by default, without requiring users to click the toggle every time a new page loads. I have limited knowledge of JavaScr ...

Using the class attribute for Pagedown instead of the id keyword

I am utilizing Pagedown, which necessitates giving the id wmd-input to a textarea. This requirement is outlined in Markdown.Editor.js as follows: function PanelCollection(postfix) { this.buttonBar = doc.getElementById("wmd-button-bar" + postfix); ...

Issue with Vue2: encountering an error with the view-router component when attempting to utilize the <router-view> tag

Currently delving into Vue2 for the first time and facing hurdles with routes. Ever since I inserted <router-view></router-view> in index.html, an exception has been popping up: [Vue warn]: Failed to mount component: template or render functi ...

How can Asynchronous Programming Model (Begin/End methods) be transformed into an event-driven asynchronous model?

Suppose there is a piece of code that utilizes the Asynchronous Programming Model, where it offers a set of methods that can be employed either synchronously or asynchronously: public MethodResult Operation(<method params>); public IAsyncResult Beg ...

The issue arises with the Google Map marker failing to function correctly when pulling data

I've recently started learning Google Maps. It's interesting that markers work and are displayed when statically declared, but not when retrieved from a database. // var markers = [[15.054419, 120.664785, 'Device1'], [15.048203, 120.69 ...

Nonspecific _POST parameter error encountered while utilizing XMLHttpRequest()

I am currently experimenting with Ajax to add data into a database using the POST method. However, I am facing an issue where PHP is unable to recognize the post variables being sent. ajax: function createUser() { var _id=document.getElementById('ne ...

What is preventing me from utilizing global variables in distinct HTML and JavaScript files?

I am facing a perplexing issue with my HTML files, specifically index.html and lobby.html. Within main.js, which is loaded in index.html, I attempt to load lobby.html using window.location.href. Despite trying various methods to define global variables i ...

Tips for correctly implementing Headers in AngularJS version 1.6

Currently, I am attempting to incorporate headers in a GET request using the $http method. This is the snippet of code that I have implemented: this.http.defaults.headers.common['Authorization'] = 'Bearer mytoken123123'; this.http.def ...

Using Vue to handle Promise resolution - incorporating Laravel Gate logic into Vue

Trying to incorporate Laravel's authorization and policy into Vue has been a challenge for me. I'm working on creating a mixin that sends a GET request to a backend controller. The issue I've encountered is that the v-if directive is receiv ...

Steps for selecting the text "Thank you for Registering" using Xpath in Selenium

I attempted to retrieve the text "Thank you for signing up" using the following Xpath: Xpath : By.xpath("//span[@class='lblMessageSignup']") or "//div[@class='SignupContent']/span" and utilized the gettext method to extract the text ...

Exploring ways to dynamically alter templates using the link function in Angular.js

Recently, I developed a directive called widget which functions similar to ng-view, but the template name is derived from an attribute. app.directive('widget', function() { return { restrict: 'EA', scope: true, ...

Differences Between AccessControlType and AceType in System Security AccessControlWhen working

Do you know if System.Security.AccessControl.AceType is simply a more elaborate version of System.Security.AccessControl.AccessControlType? Does a method exist to convert AceType to AccessControlType, or are they distinct entities? ...