質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.51%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

5回答

11881閲覧

javascriptのObject.valuesをie11で使えるようにしたい(対応しているpolyfillが知りたい)

holic

総合スコア134

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2019/01/30 15:43

編集2019/01/31 04:44

前提・実現したいこと

javascriptの「Object.values」大変便利で活用させていただいております。
ie11に対応するため普段はwebpack環境でbabelをするのですが、
訳あってトランスパイルなし環境で実装しなくてはならない状況です、

出来ましたら書き上げたコードを変更したくないので
polyfillを付与させるだけで解決したいというのが願いです。

以下にソースを載せます。

html

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6</head> 7<body> 8 <div id="aaa">aaa</div> 9 <div id="bbb">bbb</div> 10 <div id="ccc">ccc</div> 11 12 <script> 13 14 slugs= { 15 osaka: { // 大阪 16 shop_id: 108, 17 content_code: "os", 18 }, 19 yokohama: { // 横浜 20 shop_id: 101, 21 content_code: "windows", 22 }, 23 sapporo: { // 札幌 24 shop_id: 97, 25 content_code: "windows", 26 }, 27 nagoya: { // 名古屋 28 shop_id: 93, 29 content_code: "windows", 30 }, 31 kagawa: { // 香川 32 shop_id: 113, 33 content_code: "os", 34 }, 35 } 36 37 var valueFirst = Object.values(slugs)[0] 38 var keyFirst = Object.keys(slugs)[0] 39 40 //console.log(valueFirst) 41 //console.log(keyFirst) 42 43 document.getElementById("aaa").innerText = valueFirst.shop_id 44 document.getElementById("bbb").innerText = valueFirst.content_code 45 document.getElementById("ccc").innerText = keyFirst 46 </script> 47 48</body> 49</html>

お手数ではございますが、
ご教示いただけましたら幸いでございます。
よろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答5

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

holic

2019/01/31 04:43

x_x様 ご返信ありがとうございます。
guest

0

ベストアンサー

IE11の場合、もとからObject.keysは利用可能です。それを使ってObject.valuesを作るのが手っ取り早いです。

javascript

1if(!Object.values) { 2 Object.values = function(obj) { 3 // 本来は、「オブジェクトでなかった場合」の処理が入るけど、簡易的なものなので省略 4 return Object.keys(obj).map(function(key) { return obj[key]; }); 5 } 6}

投稿2019/01/31 02:35

maisumakun

総合スコア145062

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

holic

2019/01/31 04:41

maisumakun様 ご返信ありがとうございます、 大変に勉強になりました。
guest

0

オフラインでないのなら Polyfill.io を使うのが一番手っ取り早いかと思います。

Chrome などの Polyfill が必要ないブラウザでアクセスしたときには空ファイルを、IE11 などの Polyfill が必要なブラウザでアクセスしたときには Polyfill が書かれたファイルが読み込まれる仕組みになっています。

html

1<script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=Object.keys%2CObject.values"></script>

投稿2019/01/31 04:34

yhg

総合スコア2161

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

holic

2019/01/31 04:41

yhg様 ご返信ありがとうございます、 このような便利なサービスも有るのですね、 ご参考にさせていただきます。
guest

0

Object.keysはIE対応してますよね?
valuesについては無理やり書けばこんな感じでも行けそうです

javascript

1<script> 2if(!Object.prototype.values){ 3 Object.prototype.values=function(x){ 4 var ret=[]; 5 for(var i in x){ 6 if(i!=="values") ret.push(x[i]); 7 } 8 return ret; 9 }; 10} 11var slugs= { 12osaka: { // 大阪 13shop_id: 108, 14content_code: "os", 15}, 16yokohama: { // 横浜 17shop_id: 101, 18content_code: "windows", 19}, 20sapporo: { // 札幌 21shop_id: 97, 22content_code: "windows", 23}, 24nagoya: { // 名古屋 25shop_id: 93, 26content_code: "windows", 27}, 28kagawa: { // 香川 29shop_id: 113, 30content_code: "os", 31}, 32} 33var valueFirst = Object.values(slugs)[0]; 34console.log(valueFirst); 35var keyFirst = Object.keys(slugs)[0]; 36console.log(keyFirst); 37</script>

投稿2019/01/31 01:21

yambejp

総合スコア114505

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

maisumakun

2019/01/31 02:36

Object.prototype.valuesではなく、Object.values(Object経由でしか使えない)です。
yambejp

2019/01/31 03:17

たしかに・・・(汗) ご指摘ありがとうございました
think49

2019/01/31 03:50

余談ですが、Array.prototype.values() はあります。 Array.prototype.values() はイテレータを返し、Object.values() は配列を返します。
holic

2019/01/31 04:43

yambejp様 ご返信ありがとうございます、 こちらの記述も今後の参考にさせていただきます。
guest

0

たくさんの方から回答頂きまして大変恐縮です。
わたしもまずはMDN docsにたどり着いたのですが、
そこでのpolyfillの書き方がイマイチわからなかったのでこちらに投稿させていただきました。

maisumakun様やyambejp様の示した頂いたような記述をしたかったのです。
ご意見ありがとうございます。

IE11の場合「Object.keys」は利用可能とのご意見ありがとうございます。
maisumakun様をベストアンサーとさせていただきます。

投稿2019/01/31 04:36

holic

総合スコア134

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.51%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問