当给定私有变量作为参数时，Path.join 抛出异常

Posted 2023-03-22

【中文标题】当给定私有变量作为参数时，Path.join 抛出异常

【英文标题】：Path.join throws exception when given private variable as argument

【发布时间】：2021-12-06 12:58:58

【问题描述】：

我正在尝试使用 Electron，我试图加载一个 html 文件，并将该文件的路径存储在一个私有变量中。参考下面的代码。

但是 Path.join 失败并出现此错误：

但是，如果我传递具有相同值的字符串文字，它可以工作。

非工作代码：

import * as Electron from 'electron'
import * as Path from 'path'
import  Option, Some, None  from './option'

export default class Main

    private indexFilePath = 'index.html'
    private app: Electron.App
    private browserWindow: Option<Electron.BrowserWindow>

    constructor (app: Electron.App)
    
        this.app = app
        this.browserWindow = new None()
        this.app.on('ready', this.onReady)
    

    private onReady(): void
    
        this.browserWindow = new Some(new Electron.BrowserWindow(
            width: 800,
            height: 600
        ))
        this.browserWindow.unwrap().loadFile(Path.join(__dirname, this.indexFilePath))
    

工作代码：

import * as Electron from 'electron'
import * as Path from 'path'
import  Option, Some, None  from './option'

export default class Main

    private app: Electron.App
    private browserWindow: Option<Electron.BrowserWindow>

    constructor (app: Electron.App)
    
        this.app = app
        this.browserWindow = new None()
        this.app.on('ready', this.onReady)
    

    private onReady(): void
    
        this.browserWindow = new Some(new Electron.BrowserWindow(
            width: 800,
            height: 600
        ))
        this.browserWindow.unwrap().loadFile(Path.join(__dirname, 'index.html'))
    

这对我来说没有任何意义，只会增加我对任何包含 javascript 的东西的挫败感。感觉就像一架随时可能自行消失的怪异超音速飞机……

我确实检查了它是否是一些奇怪的打字稿编译错误，但不是，我选择哪个 javascript 版本都没有关系，结果是一样的。编译后的代码是这样的，我也看不出有什么问题：

class Main 
    constructor(app) 
        this.indexFilePath = 'index.html';
        this.app = app;
        this.browserWindow = new option_1.None();
        this.app.on('ready', this.onReady);
    
    onReady() 
        this.browserWindow = new option_1.Some(new Electron.BrowserWindow(
            width: 800,
            height: 600
        ));
        this.browserWindow.unwrap().loadFile(Path.join(__dirname, this.indexFilePath));
    

【问题讨论】：

请创建minimal reproducible example

这是一个明确的错误？第 1 步是控制台在您的非工作代码中记录 __dirname 和 this.indexFilePath：它们实际上是什么？

@Mike'Pomax'Kamermans 公平点，但它不会让我到任何地方，因为我不明白为什么它是未定义的。有了你的答案就很清楚了，干杯

不，但它会给你一个更好的问题，即更小的代码，因为它是“我有一个带有私有字段的类，但是当我控制台记录它，它显示为未定义。发生了什么”。这可能也会让你继续“等一下，如果我搜索那个会怎么样”。

【参考方案1】：

经典范围错误：仅仅因为您从this 中提取ready，并不意味着this.ready 具有任何定义的范围，它只是一个裸函数。

因此，当您调用this.app.on('ready', this.onReady) 时，您并不是在告诉JS 在声明时保留this 关键字的含义。相反，JS 在运行您的函数后遇到的任何this 的使用都将是“无论执行时时的范围是什么”，并且当事件处理代码触发时，这将是全局的范围而不是您的类实例。

非常简单的解决方案：这就是我们发明箭头函数的目的。

this.app.on('ready', () => this.onReady())

完成，当这个函数被执行时，它的this 仍然和声明时一样。

【讨论】：

哈，确实有道理！我对 Javascript 还是很陌生，我大部分时间都在努力解决它。谢谢。

在您进入 JS 的过程中尽早了解 JS 如何处理范围界定将在以后节省这么多时间 =)