2017-04-18 120 views
0

我基於JavaScript & Github的表情圖標的工作表情繫統上,我用一個函數來觸發輸入事件,這是我的代碼訪問對象屬性的名稱與循環

function myFunction() { 
    var y = document.getElementById("myInput").value; 
    var x = y.replace(/plus/g,'<img width="25" src="https://assets-cdn.github.com/images/icons/emoji/unicode/1f44d.png?v7" />'); 
    document.getElementById("demo").innerHTML = "You wrote: " + x; 
} 

它的工作很好,但它的不聰明 。

我嘗試使用與循環處理Github Emoji API

var data = { 
    star: "https://assets-cdn.github.com/images/icons/emoji/unicode/2b50.png?v7" 
}; 

for (var i in data) { 
    console.log(data[i]); 
} 

for循環訪問對象屬性,但不顯示它的名字,我需要更換屬性名稱的數組,最終的代碼,我想到的是:

for (vari in data) { 
var x = string.replace(/${property_name}/g, data[i]); 
} 
+2

而不是註銷'數據[I]'的 - 只要登錄'i' - '我'是屬性名稱。你沒有數組,你有一個對象。 – tymeJV

回答

1

對於完整性,更好的方法可能是避免循環和利用.replace s到需要一個回調函數能力:

var data = { 
    star: "https://assets-cdn.github.com/images/icons/emoji/unicode/2b50.png?v7" 
}; 

var pattern = new RegExp(Object.keys(data).join('|'), 'g'); 
var x = string.replace(pattern, function(match) { return data[match]; }); 
+0

它'像一個魅力的工作,但因爲它的表情符號我需要通過鏈接到標籤這樣的回報'' –

+0

你可以從回調中返回任何你想要/需要的東西。這並沒有改變這種方法的原則。 –

+0

是的,我明白了,這很好,謝謝 –

2

試試這個:

for (var key in data) { 
    if (data.hasOwnProperty(key)) { 
     var x = string.replace(new RegExp(key, "g"), data[key]); 
    } 
} 

如y OU使用for(var i in data)循環i是對象屬性不data[i]

另外,如果你想構建從你必須創建一個RegExp對象的字符串正則表達式模式。

+0

我在這裏不明白,爲什麼我需要'hasOwnProperty'? –

+0

@Kain看看這個http://stackoverflow.com/a/16735184/1552587 – Titus

+0

我理解它不知何故謝謝 –