# Iterate through dictionary/object more than 10 keys deep in CustomJS

**URL:** <https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593>\
**Category:** Community Support\
**Tags:** bokehjs\
**Created:** [November 4, 2021, 1:37pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593 "2021-11-04T13:37:33Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![gmerritt123](https://discourse.bokeh.org/user_avatar/discourse.bokeh.org/gmerritt123/32/4101_2.png) [@gmerritt123](https://discourse.bokeh.org/u/gmerritt123)\
**Post date:** [November 4, 2021, 1:37pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593/1 "2021-11-04T13:37:33Z")

</div>

Hi, I’m running into strange to me JS behaviour when trying to iterate through a dictionary passed to CustomJS. This is definitely a JS-side learning thing for me (and will probably expose my ignorance 😂 but that’s part of learning). In the callback, all I’m doing in this example is iterating through a dictionary that has more than 10 keys when triggered:

```auto
from bokeh.plotting import save
from bokeh.models import Select, CustomJS

opts=['A','B','C','D','E','F','G','H','I','J','K','L']
sel = Select(title='Thing:', options = opts)

d = {i:s for i,s in enumerate(opts)}

cb = CustomJS(args=dict(sel=sel,d=d)
              ,code='''
              console.log(d)
              for (const [key,value] in Object.entries(d)){
                      console.log(key)}
              
              ''')
sel.js_on_change('value',cb)
save(sel,'Test.html')

```

The strange (to me) behaviour when I do this is that the key being logged in the loop is only returning the first digit of the key:

 ![image](https://discourse-uploads.bokeh.org/original/2X/a/a16191f6955b114225725d3a25cc44e313640b4e.png)

I can’t recreate this writing out the same routine in JSFiddle:

 ![image](https://discourse-uploads.bokeh.org/original/2X/b/b1cf78809307d257ce0f562e7edecd99dfc5f4a1.png)

This tells me bokeh is doing something to the dictionary when I pass it? It’s very strange to me because I would like to think I’d have run into this before… hopefully there is an obvious explanation.

As another check, I also tried replacing my dictionary d with a unique string for a key:

```auto
d = {'bananas_'+str(i):s for i,s in enumerate(opts)}

```

Results in the same kind of thing:

 ![image](https://discourse-uploads.bokeh.org/original/2X/e/e4127f5265bebd1624e7590c888e5fc020fbfbde.png)

What’s going on?

Thanks…

---

<div class="post-metadata">

**Author:** ![gmerritt123](https://discourse.bokeh.org/user_avatar/discourse.bokeh.org/gmerritt123/32/4101_2.png) [@gmerritt123](https://discourse.bokeh.org/u/gmerritt123)\
**Post date:** [November 4, 2021, 2:45pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593/2 "2021-11-04T14:45:32Z")

</div>

Update, I found a workaround by simply iterating through Object.keys(d) instead… but my understanding is still completely missing.

---

<div class="post-metadata">

**Author:** ![Bryan](https://discourse.bokeh.org/user_avatar/discourse.bokeh.org/bryan/32/3625_2.png) [@Bryan](https://discourse.bokeh.org/u/Bryan)\
**Post date:** [November 4, 2021, 3:00pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593/3 "2021-11-04T15:00:36Z")

</div>

You need `for…of` (like you have in the fiddle), not `for…in`

---

<div class="post-metadata">

**Author:** ![gmerritt123](https://discourse.bokeh.org/user_avatar/discourse.bokeh.org/gmerritt123/32/4101_2.png) [@gmerritt123](https://discourse.bokeh.org/u/gmerritt123)\
**Post date:** [November 4, 2021, 3:03pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593/4 "2021-11-04T15:03:03Z")

</div>

…thank you. /embarassed

---

<div class="post-metadata">

**Author:** ![Bryan](https://discourse.bokeh.org/user_avatar/discourse.bokeh.org/bryan/32/3625_2.png) [@Bryan](https://discourse.bokeh.org/u/Bryan)\
**Post date:** [November 4, 2021, 3:18pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593/5 "2021-11-04T15:18:11Z")

</div>

It’s happened to me more times than I can remember. Purely IMO, JavaScript is just an ugly, unpleasant language with lots of warts and gotchas around every corner, unfortunately.

---

<div class="post-metadata">

**Author:** ![system](https://discourse-uploads.bokeh.org/original/2X/1/14eb24f9e10e4e9b78e3f10f66c04ffa96446e5a.svg) [@system](https://discourse.bokeh.org/u/system)\
**Post date:** [February 2, 2022, 3:18pm UTC](https://discourse.bokeh.org/t/iterate-through-dictionary-object-more-than-10-keys-deep-in-customjs/8593/6 "2022-02-02T15:18:55Z")

</div>

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.