使用类/构造方法与可变方法时的范围不同

Question

我有一个脚本，用于解析关键字的特定对象属性，然后将这些关键字和另一个属性附加到对象。 新的属性值将打印到文档中以进行错误检查。

    var chemistry = {
     field: "chemistry",
     keywords: [
         "atom",
         "proton",
         "electron",
         "wavefunction",
         "neutron",
         "catalyst"],
     filter: function( title ) {
             var i;
             for( i = 0 ; i < title.split( " " ).length; i++ )  {
             var title_part = title.toLowerCase().split( " " )[ i ];
             var j;                    
                for( j = 0 ; j < this.keywords.length; j++ ) {
                    if ( this.keywords[ j ] == title_part && library[ 0 ].keywords.indexOf( this.keywords[ j ] ) == -1 ) {
                        library[ 0 ].keywords.push( this.keywords[ j ] );
                        if ( library[ 0 ].field.indexOf( this.field ) == -1 ) {
                            library[ 0 ].field.push( this.field );
                         };
                     };
                 };
             };
         }
   };

chemistry.filter( library[0].title );

document.writeln( "KEYWORDS: " + library[0].keywords );
document.writeln( "FIELD: " + library[0].field );

这工作正常，但我正在尝试创建一个类，该类如上所述构造一个新对象。 这是我正在使用的代码

"use strict"         
class Discipline {
     constructor(field, keyword) {
         this.field = field;
         this.keywords = keyword;
         this.filter =  function( title ) {
             var i;
             for( i = 0 ; i < title.split( " " ).length; i++ )  {
             var title_part = title.toLowerCase().split( " " )[ i ];
             var j;                    
                for( j = 0 ; j < this.keywords.length; j++ ) {
                    if ( this.keywords[ j ] == title_part && library[ 0 ].keywords.indexOf( this.keywords[ j ] ) == -1 ) {
                        library[ 0 ].keywords.push( this.keywords[ j ] );
                        if ( library[ 0 ].field.indexOf( this.field ) == -1 ) {
                            library[ 0 ].field.push( this.field );
                         };
                     };
                 };
             };
         }
     }
 };

 var chemistry = new Discipline("chemistry", "electron");
 chemistry.filter( library[0].title );

 document.writeln( "KEYWORDS: " + library[0].keywords );
 document.writeln( "FIELD: " + library[0].field );

该过滤器似乎什么也不输出，我只在文档中看到“ KEYWORDS：FIELD：”。 令人困惑的是，如果我使用document.writeln（）检查library [0] .field和library [0] .keywords，我会得到期望的值。

我想知道“ this”的范围。 使用类构造函数时发生更改。 或者还有其他事情发生了吗？

顺便说一句，如果有人知道将数组作为关键字参数传递的好方法，那将不胜感激。 现在，我正在传递一个隔开的字符串并拆分它。

Answer 1

是的，范围this正在发生变化。 您可以执行以下操作：

var that = this;

然后在需要的地方使用that.keywords 。 因此，在您的代码中，如下所示：

class Discipline {
     constructor(field, keyword) {
         var that = this;
         that.field = field;
         that.keywords = keyword;
         that.filter =  function( title ) {
             var i;
             for( i = 0 ; i < title.split( " " ).length; i++ )  {
             var title_part = title.toLowerCase().split( " " )[ i ];
             var j;                    
                for( j = 0 ; j < that.keywords.length; j++ ) {
                    if ( that.keywords[ j ] == title_part && library[ 0 ].keywords.indexOf( this.keywords[ j ] ) == -1 ) {
                        library[ 0 ].keywords.push( that.keywords[ j ] );
                        if ( library[ 0 ].field.indexOf( that.field ) == -1 ) {
                            library[ 0 ].field.push( that.field );
                         };
                     };
                 };
             };
         }
     }
 };