javascript - 使用类/构造函数与变量方法时的范围不同

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 );
                         };
                     };
                 };
             };
         }
     }
 };