我有一个由两个不同变量调用的对象。有没有办法找出 - 在对象函数内 - 哪个变量调用它?
sp = new SelectedPlaylists("tableSelectedPlaylists");
sa = new SelectedPlaylists("tableSelectedAlbums");
这是两个变量
答案 0 :(得分:2)
我认为您可以在SelectedPlaylists
类中创建一个变量来确定哪种类型的播放列表并将其传递给构造函数:
sp = new SelectedPlaylists("tableSelectedPlaylists", "p");
sa = new SelectedPlaylists("tableSelectedAlbums", "a");
在构造函数中:
function SelectedPlaylists(id, type)
{
// ... Your code ...
var manageType=type;
var buttonLabel='';
switch(type)
{
case 'p':
// Playlist mode
this.buttonLabel='Remove Playlist';
case 'a':
// Album mode
this.buttonLabel='Remove Album';
}
}
将第二个参数存储在变量中(例如manageType
)并在需要时使用(查看textOnClick
var):
SelectedPlaylists.prototype.addPlaylist = function (id, name)
{
if( !id ) return -1;
var that = this;
var tablebody = this.reftable.children('tbody');
var found = false;
var rownode = this.getRowNodebyPlaylistID(id);
if(rownode)
{
return -1;
}
this.arrPlaylists.push({id:id,name:name});
demo = typeof this;
tablebody.append("<tr><td class='name'>"+name+"</td><td class='id'>"+id+"</td><td><button style='background:none!important;border:none;padding:0!important;border-bottom:1px solid #444; cursor: pointer' onclick='sp.removeRowWithTd( $(this)); console.log($(this))'>"+this.buttonLabel+"</button></td></tr>");
因此,代码更好地重用和控制,所有配置都在构造函数中完成。
希望它有所帮助!
答案 1 :(得分:0)
不,你不能。请注意,甚至可能没有用于存储对象的变量......像L.push(new Foo(1))
这样的代码完全有效,并且不会使用命名变量来存储创建的对象。
在这些情况下通常做的是向对象构造函数提供其他参数,以便您可以在处理中使用此额外参数来决定要执行的操作。
此外,如果将实际处理移出闭包中的构造函数更好,这样可以增加在其他情况下可以再次使用相同代码的可能性......例如:
function addButton(text, classname, container, f) {
var b = document.createElement("input");
b.type = "button";
b.value = text;
b.className = classname;
container.appendChild(b);
b.onclick = f;
return b;
}
addButton("b1", "redbutton", menu, function() { alert("You pressed b1"); });
addButton("b2", "bluebutton", menu2, function() { alert("You pressed b2"); });
传递封闭f
,你可以在按下时按钮的绝对自由
答案 2 :(得分:0)
我相信你的问题措辞有点不准确。我认为你的意思是当单击一个按钮删除时,就会在首先创建该行的对象上执行removeRowWithTd。
为此,一种方法是在将元素添加到DOM之后附加事件处理程序,然后传递一个引用创建该元素的实例的函数。我做了一些调整,因为你没有提供完整的代码,但以下在浏览器中为我工作,准确地将行添加到相应的表并删除它们。请注意代码中的注释。我不得不做出改变,让我的工作能够完成。
<!DOCTYPE HTML>
<html>
<head>
<title>Testing Script</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
.playlist_button {
background: none !important;
border: none;
padding: 0 !important;
border-bottom: 1px solid #444;
cursor: pointer;
}
</style>
</head>
<body>
<table id="tableSelectedPlaylists">
<tbody></tbody>
</table>
<table id="tableSelectedAlbums">
<tbody></tbody>
</table>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
// A placeholder definition
SelectedPlaylists = function(tableId) {
//Assumed functionality
this.reftable = $('#' + tableId);
this.arrPlaylists = [];
this.removeRowWithTd = function(source) {
source.parent().parent().remove();
}
};
//Extension to the prototype
SelectedPlaylists.prototype.addPlaylist = function(id, name) {
if (!id)
return -1;
var that = this;
var tablebody = this.reftable.children('tbody');
var found = false;
/* Removed ONLY for my testing as it served no purpose
var rownode = this.getRowNodebyPlaylistID(id)
if (rownode) {
return -1;
}
*/
this.arrPlaylists.push({
id : id,
name : name
});
demo = typeof this;
tablebody.append('<tr><td class="name">' + name
+ '</td><td class="id">' + id
// Next line adds id for reference after being added to DOM
+ '</td><td><button id="' + this.reftable.id + '_button_' + id
// Yes, I moved your CSS into the stylesheet and replaced with a class
+ '" class="playlist_button">Remove</button></td></tr>');
//Now, attach an onClick handler as the return of a function which gets passed itself
//and then returns another function which executes the desired method.
$('#' + this.reftable.id + '_button_' + id).on('click', function(instanceObj) {
return function() {
instanceObj.removeRowWithTd($(this));
}
}(this));
}
//Instantiation
sp = new SelectedPlaylists("tableSelectedPlaylists");
sa = new SelectedPlaylists("tableSelectedAlbums");
//Calling the new method
sa.addPlaylist(1, 'ABC');
sp.addPlaylist(2, 'DEF');
</script>
</body>
</html>
最后,断言if
是一个糟糕的编程习惯是荒谬的。在存在其他替代方案的情况下使用它们可以使脚本更有效(并且在诸如循环不变性的情况下)。虽然我几乎不了解装配,it appears that that construct is in assembly, too。明智地使用您的工具,但为了缺乏技能,不要清空您的工具箱。现在,如果您想要对构成此规则的任何人提出质疑,请告诉他们编写没有条件的脚本并仅使用Heavyside step function。
快乐的编码!