Sending an array of dictionary objects to a JavaScript function

Question

Sending an array of dictionary objects to a JavaScript function

I have a situation where I need to pass a large amount of data stored in an NSArray containing NSDictionary objects to a JavaScript function using a webview and the method:

- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script

My inquiries are:

How can I properly format my arguments at the caller end so that JavaScript can interpret them?
How do I retrieve these arguments in JavaScript? Specifically, what should the function signature look like and how can I access the key-value pairs of dictionary objects within the array in the JavaScript function?

I am not very experienced with JavaScript, so please forgive me if this question seems too vague. I hope it is clear enough!

Edit: I stumbled upon this thread which mentions that passing NSDictionary objects to JavaScript functions is not feasible. So, how can we accomplish this?

Thanks & Regards, Raj

javascript cocoa cocoa-touch uiwebview iphone

Answer 1

Answer №1

When passing parameters to

-stringByEvaluatingJavaScriptFromString:

, it is important to serialize them as a string. A convenient method is to convert the parameters to JSON using one of the available Cocoa JSON libraries. Once serialized, you can include this JSON string in your JavaScript code like so:

NSString *json = [serialize JSON here];
NSString *scriptString = [NSString stringWithFormat:@"doSomething(%@)", json];

Within the JSON representation, NSDictionaries will be transformed into JavaScript Objects, allowing you to access their elements using syntax such as array[5].someKey(or array[5]["some key"]).

Answer 2

When passing parameters to

-stringByEvaluatingJavaScriptFromString:

, it is important to serialize them as a string. A convenient method is to convert the parameters to JSON using one of the available Cocoa JSON libraries. Once serialized, you can include this JSON string in your JavaScript code like so:

NSString *json = [serialize JSON here];
NSString *scriptString = [NSString stringWithFormat:@"doSomething(%@)", json];

Within the JSON representation, NSDictionaries will be transformed into JavaScript Objects, allowing you to access their elements using syntax such as array[5].someKey(or array[5]["some key"]).

Answer 3

Answer №2

If you wanted to, you could dismantle them and piece them back together, just like this individual seems to be doing...

function stringToNSString(str) {
  return ['@"',str,'"'].join('');
}
function numberToNSNumber(num) {
  return ['[NSNumber numberWithLong:',num,']'].join('');
}
function booleanToNSNumber(bool) {
  return ['[NSNumber numberWithBool:',(bool ? 'YES' : 'NO'),']'].join('');
}

function nullToNSNull(){
  return '[NSNull null]';
}

function arrayToNSArray(array){
  var lines = _(array).map(function(value){
    var convertedValue;
    if (_(value).isString()) {
      convertedValue = stringToNSString(value);
    } else if (_(value).isNumber()) {
      convertedValue = numberToNSNumber(value);
    } else if (_(value).isBoolean()) {
      convertedValue = booleanToNSNumber(value);
    } else if (_(value).isNull()) {
      convertedValue = nullToNSNull();
    } else if  (_(value).isArray()) {
      convertedValue = arrayToNSArray(value);
    } else if  (typeof value === 'object') {
      convertedValue = objectToNSDictionary(value);
    }
    return convertedValue;
  }).map(function(value){
    return value + ', ';
  });
  lines.unshift('[NSArray arrayWithObjects:');
  lines.push('nil]');
  return lines.join('');
}
function objectToNSDictionary(obj){
  var lines = _(obj).map(function(value,key){
    var convertedValue;
    if (_(value).isString()) {
      convertedValue = stringToNSString(value);
    } else if (_(value).isNumber()) {
      convertedValue = numberToNSNumber(value);
    } else if (_(value).isBoolean()) {
      convertedValue = booleanToNSNumber(value);
    } else if (_(value).isNull()) {
      convertedValue = nullToNSNull();
    } else if  (_(value).isArray()) {
      convertedValue = arrayToNSArray(value);
    } else if  (typeof value === 'object') {
      convertedValue = objectToNSDictionary(value);
    }
    return [convertedValue,stringToNSString(key)];
  }).map(function(valueKey){
    valueKey.push('');
    return valueKey.join(',');
  });
  lines.unshift('[NSDictionary dictionaryWithObjectsAndKeys:');
  lines.push('nil]');
  return lines.join('\n');
}

Answer 4

If you wanted to, you could dismantle them and piece them back together, just like this individual seems to be doing...

function stringToNSString(str) {
  return ['@"',str,'"'].join('');
}
function numberToNSNumber(num) {
  return ['[NSNumber numberWithLong:',num,']'].join('');
}
function booleanToNSNumber(bool) {
  return ['[NSNumber numberWithBool:',(bool ? 'YES' : 'NO'),']'].join('');
}

function nullToNSNull(){
  return '[NSNull null]';
}

function arrayToNSArray(array){
  var lines = _(array).map(function(value){
    var convertedValue;
    if (_(value).isString()) {
      convertedValue = stringToNSString(value);
    } else if (_(value).isNumber()) {
      convertedValue = numberToNSNumber(value);
    } else if (_(value).isBoolean()) {
      convertedValue = booleanToNSNumber(value);
    } else if (_(value).isNull()) {
      convertedValue = nullToNSNull();
    } else if  (_(value).isArray()) {
      convertedValue = arrayToNSArray(value);
    } else if  (typeof value === 'object') {
      convertedValue = objectToNSDictionary(value);
    }
    return convertedValue;
  }).map(function(value){
    return value + ', ';
  });
  lines.unshift('[NSArray arrayWithObjects:');
  lines.push('nil]');
  return lines.join('');
}
function objectToNSDictionary(obj){
  var lines = _(obj).map(function(value,key){
    var convertedValue;
    if (_(value).isString()) {
      convertedValue = stringToNSString(value);
    } else if (_(value).isNumber()) {
      convertedValue = numberToNSNumber(value);
    } else if (_(value).isBoolean()) {
      convertedValue = booleanToNSNumber(value);
    } else if (_(value).isNull()) {
      convertedValue = nullToNSNull();
    } else if  (_(value).isArray()) {
      convertedValue = arrayToNSArray(value);
    } else if  (typeof value === 'object') {
      convertedValue = objectToNSDictionary(value);
    }
    return [convertedValue,stringToNSString(key)];
  }).map(function(valueKey){
    valueKey.push('');
    return valueKey.join(',');
  });
  lines.unshift('[NSDictionary dictionaryWithObjectsAndKeys:');
  lines.push('nil]');
  return lines.join('\n');
}

Answer 5

Answer №3

After gaining more knowledge, I now consider that this (JSONKit on GitHub) may be a superior solution. JSONKit offers mappings of primitive types to Objective-C Foundation classes:

╭───────────────┬─────────────────────╮
│  JSON         │  Objective -C       │
├───────────────┼─────────────────────┤
│  true|false   │  NSNull             │
├───────────────┼─────────────────────┤
│  Number       │  NSNumber           │   
├───────────────┼─────────────────────┤
│  String       │  NSString           │
├───────────────┼─────────────────────┤
│  Array        │  NSArray            │
├───────────────┼─────────────────────┤
│  Object       │  NSDictionary       │
╰───────────────┴─────────────────────╯

In JSONKit, Objects can be viewed as Associative Arrays, Key / Value Hash Tables, Maps, or Dictionaries, etc.

It is mentioned that JSONKit utilizes Core Foundation internally and assumes equivalence between Core Foundation and Foundation for base types, such as CFString ≡ NSString. Additionally, it is noted that JSONKit is not considered ARC-safe.

Answer 6

After gaining more knowledge, I now consider that this (JSONKit on GitHub) may be a superior solution. JSONKit offers mappings of primitive types to Objective-C Foundation classes:

╭───────────────┬─────────────────────╮
│  JSON         │  Objective -C       │
├───────────────┼─────────────────────┤
│  true|false   │  NSNull             │
├───────────────┼─────────────────────┤
│  Number       │  NSNumber           │   
├───────────────┼─────────────────────┤
│  String       │  NSString           │
├───────────────┼─────────────────────┤
│  Array        │  NSArray            │
├───────────────┼─────────────────────┤
│  Object       │  NSDictionary       │
╰───────────────┴─────────────────────╯

In JSONKit, Objects can be viewed as Associative Arrays, Key / Value Hash Tables, Maps, or Dictionaries, etc.

It is mentioned that JSONKit utilizes Core Foundation internally and assumes equivalence between Core Foundation and Foundation for base types, such as CFString ≡ NSString. Additionally, it is noted that JSONKit is not considered ARC-safe.

Sending an array of dictionary objects to a JavaScript function

Answer №1

Answer №2

Answer №3

Similar questions

Running "vue ui" with Node.js v17.2.0 - A step-by-step guide

What could be causing the QullJS delta to display in a nonsensical sequence?

Enhance Your HTML Skills: Amplifying Table Display with Images

What are the security benefits of using Res.cookie compared to document.cookie?

Tips for extracting both the div and entire inner content using JavaScript

using angularjs to dynamically apply css styles

Preventing Content Changes When Ajax Request Fails: Tips for Error Checking

TypeScript does not perform type checking on arrays created using the Array() constructor and filled with the fill method

Issue encountered where Moment locale functionality is working in local development environment, but not functioning properly in the

A guide on organizing nested JSON objects in JavaScript

Utilize Dojo to programmatically showcase an image

Tips on inserting text into form input fields

Unable to retrieve Angular Service variable from Controller

What is the best way to showcase a photo selected using an HTML input within a div container?

When combining CSS grids, nesting them can sometimes cause issues with the height layout

employing flush for lodash's throttle wrapper

Toggle the play/pause function by clicking - Trigger Ajax

Flashing bug in the outFunction of jquery hover()

JavaScript-based tool for extracting content from Sketch file

Pressing the button will activate the Ctrl+z and Ctrl+y key commands