我在一个对象中放了三个数组,我想让它们中的每一个都设置值,我尝试Object.keys(obj).forEach(function(key){
遍历它,它获得了一个对象的值,但我无法获得该项的第三级。
而且,我尝试了const iterate = (obj)
,它不太好用。
迭代函数是否可以获取项,然后设置值,或者使用.forEach获取。
浏览器搜索工具
var iconsData = {
iconArraya: [
{
name: 'bilibili',
image:'https://i.ibb.co/R9HMTyR/1-5.png',
host: ['www.bilibili.com'],
popup: function (text) {
open('https://search.bilibili.com/live?keyword=' + encodeURIComponent(text));
}
}
],
iconArrayb: [
{
name: 'open',
image:'https://i.ibb.co/R9HMTyR/1-5.png',
host: [''],
popup: function (text) {
if(text.indexOf("http://")==0||text.indexOf("https://")==0)
window.open(text, "_blank");
else window.open("http://"+text, "_blank");
}
}
],
iconArrayc: [
{
name: 'copy',
image:'https://i.ibb.co/R9HMTyR/1-5.png',
host: [''],
popup: function (text) {
if(text.indexOf("http://")==0||text.indexOf("https://")==0)
window.open(text, "_blank");
else window.open("http://"+text, "_blank");
}
}
],
hostCustomMap: {}
}
Object.keys(iconsData).forEach((key, index) => {
Object.keys(iconsData[key]).forEach((keya, index) => {
iconsData[key][keya].host.forEach(function (host) { // The console shows an Error
iconsData.hostCustomMap[host] = iconsData[key][keya].custom;
});
});
});
var text = GM_getValue('search');
if (text && window.location.host in iconsData.hostCustomMap) {
keyword.beforeCustom(iconsData.hostCustomMap[window.location.host]);
}
var iconArray =
{
icona: document.createElement('div'),
iconb: document.createElement('div'),
iconc: document.createElement('div')
}
Object.keys(iconsData).forEach((key, indexa) => {
Object.keys(iconsData[key]).forEach((keya, indexb) => {
Object.keys(iconsData[key][keya]).forEach(function (obj) {
var img = document.createElement('img');
img.setAttribute('src', obj.image);
img.setAttribute('alt', obj.name);
img.setAttribute('title', obj.name);
img.addEventListener('mouseup', function () {
keyword.beforePopup(obj.popup);
});
img.setAttribute('style', '' +
'cursor:pointer!important;' +
'display:inline-block!important;' +
'width:22px!important;' +
'height:22px!important;' +
'border:0!important;' +
'background-color:rgba(255,255,255,1)!important;' +
'padding:0!important;' +
'margin:0!important;' +
'margin-right:5px!important;' +
'');
Object.keys(iconArray).forEach((keyb, indexc) => {
if(indexc = indexa){
iconArray[keyb].appendChild(img);
console.log(indexc,indexa)
}
});
});
});
});
Object.getOwnPropertyNames(iconArray).forEach(function(key){
iconArray[key].setAttribute('style', '' +
'display:none!important;' +
'position:absolute!important;' +
'padding:0!important;' +
'margin:0!important;' +
'font-size:13px!important;' +
'text-align:left!important;' +
'border:0!important;' +
'background:transparent!important;' +
'z-index:2147483647!important;' +
'');
});
Object.getOwnPropertyNames(iconArray).forEach(function(key){
document.documentElement.appendChild(iconArray[key]);
});
document.addEventListener('mousedown', function (e) {
if (e.target == iconArray || (e.target.parentNode && e.target.parentNode == iconArray)) {
e.preventDefault();
}
});
document.addEventListener("selectionchange", function () {
if (!window.getSelection().toString().trim()) {
iconArray.icona.style.display = 'none';
iconArray.iconb.style.display = 'none';
iconArray.iconc.style.display = 'none';
}
});
document.addEventListener('mouseup', function (e) {
if (e.target == iconArray || (e.target.parentNode && e.target.parentNode == iconArray)) {
e.preventDefault();
return;
}
var text = window.getSelection().toString().trim();
var url = text.match(/(https?://(w[w-]*.)+[A-Za-z]{2,4}(?!w)(:d+)?(/([x21-x7e]*[w/=])?)?|(w[w-]*.)+(com|cn|org|net|info|tv|cc|gov|edu)(?!w)(:d+)?(/([x21-x7e]*[w/=])?)?)/i);
if (url && iconArray.iconb.style.display == 'none') {
iconArray.iconb.style.top = e.pageY +40 + 'px';
if(e.pageX -70<10)
iconArray.iconb.style.left='10px';
else
iconArray.iconb.style.left = e.pageX -70 + 'px';
iconArray.iconb.style.display = 'block';
} else if (text.length >= 30) {
iconArray.iconc.style.top = e.pageY +40 + 'px';
if(e.pageX -70<10)
iconArray.iconc.style.left='10px';
else
iconArray.iconc.style.left = e.pageX -70 + 'px';
iconArray.iconc.style.display = 'block';
} else if (!text) {
iconArray.icona.style.display = 'none';
iconArray.iconb.style.display = 'none';
iconArray.iconc.style.display = 'none';
} else if(text && iconArray.icona.style.display == 'none'){
iconArray.icona.style.top = e.pageY +40 + 'px';
if(e.pageX -70<10)
iconArray.icona.style.left='10px';
else
iconArray.icona.style.left = e.pageX -70 + 'px';
iconArray.icona.style.display = 'block';
}
});
Object.keys(object)
返回所提供对象的属性名数组,在您的情况下,它将返回[iconArraya,iconArrayb,iconArrayc]
。如果要这样做,您必须引用对象,即对于数组中的每个值,您需要执行object[value]
by the way this is called bracket notation you can search it if you're unfamiliar it the same using a dot like object.value
以下是如何===
[iconArraya,iconArrayb,iconArrayc].forEach(property=>{
object[property];
})
也可以使用Object.values(object)
访问值以下是如何===
Object.values(object).forEach(value=>{
//here you don't have to reference the object you have direct access to the
value
})
或使用for。。。在循环中并且由于。。。在循环中,您可以访问属性,您还必须引用对象,方法如下===
for(property in object){
object[property];
// you can do whatever you want with the values even change them
}
您得到了一个错误,因为您的代码试图用.forEach((迭代hostCustomMap,这不是您想要做的。
使用构造函数检查以确保属性是数组:
Object.keys(iconsData).forEach((key, index) => {
if (iconsData[key].constructor==Array) {
Object.keys(iconsData[key]).forEach((keya, index) => {
iconsData[key][keya].host.forEach(function (host) { // The console shows an Error
iconsData.hostCustomMap[host] = iconsData[key][keya].custom;
});
});
}
});