📐
Thunkable Docs
Build an AppDrag and Drop DocsSnap to Place Docs
Snap to Place
Snap to Place
  • 👋Welcome to Thunkable Docs
  • 👶Getting Started
    • Signing In
    • Your Thunkable Projects Page
    • Tutorials
    • Live Test your App
  • 🆕Create New Project
    • Project Settings
    • Project Assets and Sizes
  • Thunkable Sample Projects
  • Public Gallery of Projects
  • 🛠️ Components
  • 🔘User Interface
  • Button
  • Label
  • Text Input
  • List Viewer
  • Web Viewer
  • Switch
  • Slider
  • Alert
  • Loading Icon
  • Date Input
  • Time Input
  • PDF Reader
  • Rating
  • 📊Data Viewers
  • Data Viewer List
  • Data Viewer Grid
  • Custom Data Viewer Layout
  • Data Sources
  • 📐Layout
  • Top Tab Navigator
  • Bottom Tab Navigator
  • Stack Navigator
  • Drawer Navigator
  • Screen
  • Row
  • Column
  • 📷 Image
  • Image
  • Photo Library
  • Camera
  • Barcode Scanner
  • Image Recognizer
  • Animation by Lottie
  • Video
  • Video Recorder
  • 🗄️ Data
  • Local Storage
  • Local DB
  • Realtime DB by Firebase
  • Airtable
  • Media DB by Cloudinary
  • File Picker
  • Web API
  • 🌍Location
  • Maps by Google and Apple
  • Location Sensor
  • 💲Monetization
  • Ads by AdMob
  • In-App Purchase
  • 🌐Sensors
  • Gyroscope
  • Magnetometer
  • Accelerometer
  • Timer
  • Bluetooth Low Energy
  • 🔊Voice
  • Sound
  • Text to Speech
  • Speech Recognizer
  • Translator
  • Audio Recorder
  • 🤝Social
  • Share
  • Email Sign In by Firebase
  • Push Notifications by One Signal
  • 🎮Gaming
  • Canvas
  • Sprites
  • Sprite Gallery
  • Canvas Label
  • 🤖Gaming Blocks🎮
  • Events
  • Motion
  • Looks
  • Direction
  • Sensing
  • Add & Remove
  • Stage
  • Canvas Label
  • 🤖Blocks
  • Control
  • Logic
  • Math
  • Text
  • Lists
  • Color
  • Objects
  • Device
  • Variables
  • Functions
  • "Any Component" Blocks
  • 🖥️ App Services & Emulators
  • 🔒App Data Privacy
  • ➕Make Copy
  • 📥Download
  • 📤Share
  • 📱Publish
  • Publish to App Store (iOS)
    • TestFlight Overview
      • TestFlight in Depth
  • Publish to Play Store (Android) with AAB
  • Publish as a Web App
  • Generate Screenshots
  • 🔎Troubleshooting
    • Login Issues
    • FAQs
  • 📏Intro to Spacing
  • 🖼️ Intro to Sizing
  • 🔤Fonts
  • 💾Managing Storage
  • 📝Bugs and Product Feedback
  • Snap to Place Hour of Code Videos
Powered by GitBook
On this page
  • Creating an Object
  • Create a New Object
  • Convert between Object and JSON
  • Reading Property Values of an Object
  • Get Values of an Object
  • Get Properties of an Object
  • Set Property Values of an Object
  • Examples of using Object blocks in your app
  • Getting values from an API

Was this helpful?

Export as PDF

Objects

PreviousColorNextDevice

Last updated 2 years ago

Was this helpful?

The Object blocks pair well with the , and components which often send data in object format. The component also requires data to be in object format for it to upload successfully as a row

Creating an Object

Create a New Object

You can use the following block to create a new object. Objects can be uploaded to your as the value of a , or they can be uploaded to an as a row object.

You can click on the gear icon to add properties to your object:

Convert between Object and JSON

Similarly, you may want to convert an Object to JSON to make an API POST, or set headers or query parameters for your API call. You can do this with the generate JSON from Object block:

Reading Property Values of an Object

Get Values of an Object

You can use the get property block to read the value of an object's property. If the object does not have a property with this name, it will return undefined.

Nested values and values from Arrays

The Get Values Of block can be used to get nested values, ie. properties of properties of an object. If you are trying to get nested property b of property a of an object, you can simply get property a.b of an object, instead of using multiple get property of blocks.

You can also get a value from an Array (or list) of values. If an object property b is a 3-items list, and you want to get the second item of that list, you can get property b[2] of that object. The first item of the list is at index 1.

The blocks below demonstrate each of these methods, as well as a block that combines these methods by getting a value from an array that is a nested property of an object. The blocks are presented with the objects written in JSON format as well as created with Objects blocks, but both sets of blocks are doing exactly the same thing. In these blocks, Get nested property will return 5, Get value from array will return 6, and Get value from nested array will return 7.

Get Properties of an Object

You can use the get Object properties of block to return the names of the properties of an object.

Set Property Values of an Object

With the set property block, you can change the value of a single property of an object.

Examples of using Object blocks in your app

Getting values from an API

{ "response": { "version": "0.1", "termsofService": "http://www.wunderground.com/weather/api/d/terms.html", "features": { "conditions": 1 }}, "current_observation": { "image": { "url": "http://icons-ak.wxug.com/graphics/wu2/logo_130x80.png", "title": "Weather Underground", "link": "http://www.wunderground.com" }, "display_location": { "full": "San Francisco, CA", "city": "San Francisco", "state": "CA", "state_name": "California", "country": "US", "country_iso3166": "US", "zip": "94101", "latitude": "37.77500916", "longitude": "-122.41825867", "elevation": "47.00000000" }, "observation_location": { "full": "SOMA - Near Van Ness, San Francisco, California", "city": "SOMA - Near Van Ness, San Francisco", "state": "California", "country": "US", "country_iso3166": "US", "latitude": "37.773285", "longitude": "-122.417725", "elevation": "49 ft" }, "estimated": {}, "station_id": "KCASANFR58", "observation_time": "Last Updated on June 27, 5:27 PM PDT", "observation_time_rfc822": "Wed, 27 Jun 2012 17:27:13 -0700", "observation_epoch": "1340843233", "local_time_rfc822": "Wed, 27 Jun 2012 17:27:14 -0700", "local_epoch": "1340843234", "local_tz_short": "PDT", "local_tz_long": "America/Los_Angeles", "local_tz_offset": "-0700", "weather": "Partly Cloudy", "temperature_string": "66.3 F (19.1 C)", "temp_f": 66.3, "temp_c": 19.1, "relative_humidity": "65%", "wind_string": "From the NNW at 22.0 MPH Gusting to 28.0 MPH", "wind_dir": "NNW", "wind_degrees": 346, "wind_mph": 22.0, "wind_gust_mph": "28.0", "wind_kph": 35.4, "wind_gust_kph": "45.1", "pressure_mb": "1013", "pressure_in": "29.93", "pressure_trend": "+", "dewpoint_string": "54 F (12 C)", "dewpoint_f": 54, "dewpoint_c": 12, "heat_index_string": "NA", "heat_index_f": "NA", "heat_index_c": "NA", "windchill_string": "NA", "windchill_f": "NA", "windchill_c": "NA", "feelslike_string": "66.3 F (19.1 C)", "feelslike_f": "66.3", "feelslike_c": "19.1", "visibility_mi": "10.0", "visibility_km": "16.1", "solarradiation": "", "UV": "5", "precip_1hr_string": "0.00 in ( 0 mm)", "precip_1hr_in": "0.00", "precip_1hr_metric": " 0", "precip_today_string": "0.00 in (0 mm)", "precip_today_in": "0.00", "precip_today_metric": "0", "icon": "partlycloudy", "icon_url": "http://icons-ak.wxug.com/i/c/k/partlycloudy.gif", "forecast_url": "http://www.wunderground.com/US/CA/San_Francisco.html", "history_url": "http://www.wunderground.com/history/airport/KCASANFR58/2012/6/27/DailyHistory.html", "ob_url": "http://www.wunderground.com/cgi-bin/findweather/getForecast?query=37.773285,-122.417725" } }

You may just want to pull out one attribute (like temp_f or the temperature in Farenheit). To do so, you'll need to use the object blocks below:

Sometimes, you want to convert between JSON (JavaScript Object Notation) and Objects. If an returns a JSON value, you can convert it to an Object to use with Object blocks. Use the get object from JSON block:

This block returns a list of property names. This list can be used with blocks.

You can use Object blocks when making calls to an

Often, when retrieving data from an API like , you will get a large data dump in JSON format like shown below.

API
list
API.
Weather Underground
Web API
Map
Location Sensor
Spreadsheet
Firebase DB
Airtable DB
cloud variable