使用类/构造函数与变量方法时的作用域不同

different scope when using class/constructor vs. variable methods

本文关键字:作用域 方法 变量 构造函数      更新时间:2023-09-26

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

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

过滤器似乎没有输出任何内容,我只在文档中看到"关键字:字段:"。令人困惑的是,如果我使用 document.writeln() 检查 library[0].field 和 library[0].关键字,我会得到预期的值。

我想知道当我使用类构造函数时,"this."的范围是否会改变。还是发生了其他事情?

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

是的,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 );
                         };
                     };
                 };
             };
         }
     }
 };