相关疑难解决方法(0)

在JavaScript中使用构造函数创建类时,是否可以在以后重新定义类的方法？

例:

function Person(name)
{
    this.name = name;
    this.sayHello = function() {
        alert('Hello, ' + this.name);
    };
};

var p = new Person("Bob");
p.sayHello();   // Hello, Bob

现在我想像这样重新定义sayHello:

// This doesn't work (creates a static method)
Person.sayHello() = function() {
   alert('Hola, ' + this.name);
};

所以当我创建另一个时Person,sayHello将调用新方法:

var p2 = new Person("Sue");
p2.sayHello();   // Hola, Sue
p.sayHello();    // Hello, Bob

编辑:

我意识到我可以发送一个像"Hello"或"Hola"这样的参数sayHello来完成不同的输出.我也意识到我可以简单地为p2分配一个新函数,如下所示:

p2.sayHello = function() { alert('Hola, ' + this.name); };

我只是想知道我是否可以重新定义类的方法,所以新的实例Person …

我正在尝试理解我在ES6课程中观察到的这种行为.请考虑以下代码.这很简单:我有一个父类(Parent)和一个Child继承自它的子类().Parentclass有一个方法getLabel,只需返回该类的label属性.

当我创建子类的实例时,设置其标签并尝试打印它一切正常.

但是,当我通过Object.assign在第一个实例上使用创建另一个子类实例时,即使我明确地更改它,新实例仍会保留第一个实例的标签值.

class Parent {
  constructor(label) {
    this.getLabel = () => {
      return this.label;
    };
    this.label = label;
  }
}

class Child extends Parent {
  constructor(label) {
    super(label);
    this.label = label;
  }
}

const c = new Child('Child');
console.log('c getLabel() = ' + c.getLabel());//Prints "Child"
const c1 = Object.assign(new Child('C1'), c);
c1.label = 'Child Modified';
console.log('c1 getLabel() = ' + c1.getLabel());//Prints "Child" again instead of "Child Modified".

我不确定为什么会这样!

我所做的是改变了我 …

我完全被这个难过了.我在页面上有三个元素.topic-link.

<div id="parent1">
  <a href="#" class="topic-link"></a>
</div>
<div id="parent2">
  <a href="#" class="topic-link"></a>
</div>
<div id="parent3">
  <a href="#" class="topic-link"></a>
</div>

我可以$('.topic-link').eq(0).parent();在JS控制台中运行并返回正确的父级.但是当我遍历它们时,我每次都得到一个空对象.

$('.topic-link').each( () => {
  console.log($(this).parent());
});

// returns 3 empty objects 

我有一个箭头功能,我试图执行call().为简化起见,如下:

按预期运作

const func = (e) => {
    console.log(e)
}

func.call(null, e)

嗯......这里发生了什么？

我希望下面的代码传递element到func作为this.

const func = (e) => {
    console.log(this)
    console.log(e)
}

func.call(element, e)

但是,相反this仍然存在undefined.

如果我将它切换到常规函数定义,则所有都按预期工作.

const func = function (e) {
    console.log(this)
    console.log(e)
}

func.call(element, e)

题

为什么我无法将上下文传递给this箭头函数call()？

我在这里有一个高阶sorta函数.

虽然这按预期工作:

var square = (a) => a * a;

var callAndLog = (func) => {
  return function () {
    var res = func.apply(undefined, arguments);
    console.log("Result is: " + res);
    return res;
  }
};

var squareAndLog = callAndLog(square);

squareAndLog(5);  // Result is 25

这里,当我返回一个箭头功能时,它不起作用:

var square = (a) => a * a;
var callAndLog = (func) => {
  return (() => {
    var res = func.apply(undefined, arguments);
    console.log("Result is: " + res);
    return res;
  })
};
var squareAndLog = callAndLog(square); …

当我尝试将简单的 ES5 代码转换为 ES6 时，我有点困惑。

假设我有这个代码块：

var obj = {num: 2}

var addToThis = function (a, b, c) {
  return this.num + a + b + c
}

// call
console.log(addToThis.call(obj, 1, 2, 3))

// apply
const arr = [1, 2, 3]
console.log(addToThis.apply(obj, arr))

// bind
const bound = addToThis.bind(obj)
console.log(bound(1, 2, 3))

上面的一切都按预期运行顺利。

但是一旦我开始使用诸如 const 和箭头函数之类的 ES6 特性，就像这样：

const obj = {num: 2}

const addToThis = (a, b, c) => {
  return this.num + a + b + c …

$("body").on('click', 'ul#ajax-users-list>li', () => {
    console.log( $(this).data('id') );
});

此代码返回undefined,因为$(this)= [Window].

如何访问元素的数据属性,触发点击事件？

HTML

<div class="sym-box" data-card="0">
    <div id="a"><img src="..."></div>
</div>
<div class="sym-box" data-card="1">
    <div id="b"><img src="..."></div>
</div>
<div class="sym-box" data-card="2">
    <div id="c"><img src="..."></div>
</div>

JS

var attribute;

function myFunction() {
    attribute = this.getAttribute('data-card');
}

var symboxes = document.getElementsByClassName('sym-box');

for (i = 0; i < symboxes.length; i++) {
  symboxes[i].addEventListener('click', myFunction, false);
}

上面的代码按预期工作，'this' 引用了被点击的元素。然而，当我把它写成一个箭头函数时，我得到“Uncaught TypeError: this.getAttribute is not a function”，因为“this”现在指的是 window 对象。

const myFunction = () => {
    attribute = this.getAttribute('data-card');
};

所以我的问题是如何将 myFunction() 重写为箭头函数，其中“this”指的是被点击的元素？

注意： 我的问题已被标记为重复，但我要求在使用箭头函数时解决相同的问题。只是被告知“你不能”或“不要”并不能回答我的问题。

如何将角度 2 单击事件添加到图表类型为条形的高图表？我正在尝试使用下面的代码：

let chart = new highCharts.Chart('container', Class1.createBarChart());
chart.series.click = this.clickBars();

clickBars() {
  console.log('bar clicked');
}

<chart>由于技术限制，我不想使用指令。另外，我不想在高图表配置对象中调用单击事件。请让我知道适当的解决方案。

编辑：

我根据建议尝试了以下代码：

 chart.options.plotOptions.series.point.events.click = (function(event) { this.clickBars(event) }).bind(this);

但这里 this.clickBars 未定义。尽管我在班级中创建了一个函数。

如果我使用如下代码：

chart.options.plotOptions.series.point.events.click = (event) => this.clickBars(event);

然后它返回“非法返回语句”。

巴贝尔正在发挥其魔力,这使我对正在发生的事情感到非常困惑.

这个反应组件中foo和bar之间有什么区别？什么时候应该使用哪个？

class MyComponent extends Component {
  foo() {
    //...
  }
  bar = () => {
   //... 
  }
}

(我自己的猜测是foo在原型中,bar在构造函数中？反正我不知道我在说什么)