JS函数如何定义函数上下文_JS函数上下文定义与this指向详解

function foo() {
  console.log(this);
}
foo(); // 非严格模式：window；严格模式：undefined

const obj = {
  name: 'Alice',
  greet() {
    console.log(this.name);
  }
};
obj.greet(); // 输出：Alice，this指向obj

function Person(name) {
  this.name = name;
}
const p = new Person('Bob');
console.log(p.name); // Bob，this指向新创建的p实例

function logThis() {
  console.log(this.name);
}
const user = { name: 'Charlie' };
logThis.call(user);   // Charlie
logThis.apply(user);  // Charlie
const boundFn = logThis.bind(user);
boundFn();            // Charlie

const obj = {
  name: 'Dana',
  regularFunc: function() {
    console.log('regular:', this.name);
  },
  arrowFunc: () => {
    console.log('arrow:', this.name);
  }
};
obj.regularFunc(); // regular: Dana
obj.arrowFunc();   // arrow: undefined（继承的是外层的this，通常是window）

function handleClick() {
  console.log(this.id);
}
const button = { id: 'btn-1', onClick: handleClick.bind(button) };
button.onClick(); // btn-1