首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js 获取当前this对象

在 JavaScript 中,this 关键字用于引用当前执行上下文的对象。它的值取决于函数的调用方式。以下是 this 在不同情况下的行为:

全局上下文中的 this

在全局执行上下文中(即任何函数体外部),this 指向全局对象。在浏览器中,全局对象是 window

代码语言:txt
复制
console.log(this); // 在浏览器中输出: Window {...}

函数中的 this

在函数内部,this 的值取决于函数是如何被调用的。

简单函数调用

在非严格模式下,如果函数是作为普通函数调用的,this 指向全局对象(浏览器中的 window)。在严格模式下,thisundefined

代码语言:txt
复制
function showThis() {
  console.log(this);
}

showThis(); // 在浏览器中输出: Window {...} (非严格模式)

对象方法调用

当函数作为对象的方法被调用时,this 指向调用该方法的对象。

代码语言:txt
复制
const obj = {
  name: 'Alice',
  greet: function() {
    console.log(`Hello, I'm ${this.name}`);
  }
};

obj.greet(); // 输出: Hello, I'm Alice

构造函数中的 this

当一个函数通过 new 关键字被用作构造函数时,this 指向新创建的实例对象。

代码语言:txt
复制
function Person(name) {
  this.name = name;
}

const alice = new Person('Alice');
console.log(alice.name); // 输出: Alice

使用 callapplybind

可以使用 callapplybind 方法来显式地设置函数调用时 this 的值。

代码语言:txt
复制
function showThis() {
  console.log(this);
}

const obj = { name: 'Alice' };

showThis.call(obj); // 输出: { name: 'Alice' }
showThis.apply(obj); // 输出: { name: 'Alice' }

const boundShowThis = showThis.bind(obj);
boundShowThis(); // 输出: { name: 'Alice' }

箭头函数中的 this

箭头函数没有自己的 this 绑定,它会捕获其所在上下文的 this 值。

代码语言:txt
复制
const obj = {
  name: 'Alice',
  greet: function() {
    setTimeout(() => {
      console.log(`Hello, I'm ${this.name}`);
    }, 100);
  }
};

obj.greet(); // 输出: Hello, I'm Alice

在上面的例子中,即使 setTimeout 是在全局上下文中调用的,箭头函数仍然捕获了 greet 方法中的 this 值。

了解 this 的工作原理对于编写可预测和无错误的 JavaScript 代码至关重要。在不同的上下文和调用方式中正确地使用 this 可以避免许多常见的陷阱。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • JS获取当前网址信息

    通过window.location对象获取对应的属性 1、设置或获取对象指定的文件名或路径(pathname) window.location.pathname 2、设置或获取整个 URL 为字符串(href...) window.kk 3、设置或获取与 URL 关联的端口号码(port) window.location.port 4、设置或获取 URL 的协议部分(protocol) window.location.protocol...设置或获取 href 属性中在井号“#”后面的分段(hash) window.location.hash 设置或获取 location 或 URL 的 hostname 和 port 号码(host)...(url.lastIndexOf('=')+1, url.length); 用来得到当前网页的域名 document.domain 注意: 1、获取过后直接使用substring方法截取我们需要的信息。...2、通过正则表达式准确的获取我们需要的参数。

    13.8K30

    js如何获取计算机当前时间,js获取当前系统时间实例代码

    mydate.getmonth(); //获取当前月份(0-11,0代表1月) mydate.getdate(); //获取当前日(1-31) mydate.getday(); //获取当前星期...(); //获取当前分钟数(0-59) mydate.getseconds(); //获取当前秒数(0-59) mydate.getmilliseconds(); //获取当前毫秒数...mydate.tolocalestring( ); //获取日期与时间 例1,js获取当前时间 js中日期操作: 复制代码 代码示例: var mydate = new date(); mydate.getyear...mydate.getmonth(); //获取当前月份(0-11,0代表1月) mydate.getdate(); //获取当前日(1-31) mydate.getday(); //获取当前星期x(0-...clock += “0”; clock += hh + “:”; if (mm < 10) clock += ‘0’; clock += mm; return(clock); } 有时需要时间戳功能,js

    17.1K40

    前端如何获取当前时间_js 获取年份

    前端js获取当前时间的方法: var time = new Date(); time.getYear(); //获取当前年份 time.getFullYear(); //获取完整的年份(4位,1970...time.getMonth(); //获取当前月份(0-11,0代表1月) time.getDate(); //获取当前日(1-31) time.getDay(); //获取当前星期X(0-6,0代表星期天...) time.getTime(); //获取当前时间(从1970.1.1开始的毫秒数) time.getHours(); //获取当前小时数(0-23) time.getMinutes(); //...获取当前分钟数(0-59) time.getSeconds(); //获取当前秒数(0-59) time.getMilliseconds(); //获取当前毫秒数(0-999) time.toLocaleDateString...(); //获取当前日期 var mytime=time.toLocaleTimeString(); //获取当前时间 time.toLocaleString( ); //获取日期与时间 为了让大家有一个更感官的了解

    34.1K20

    JS获取当前年份月

    则月份为数字,会和年份相加,如201210,则会变为2022,需要加.toString() 以下是搜到的有用内容: var myDate = new Date(); myDate.getYear(); //获取当前年份...myDate.getMonth(); //获取当前月份(0-11,0代表1月) myDate.getDate(); //获取当前日(1-31) myDate.getDay(); //获取当前星期X(0-...6,0代表星期天) myDate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数) myDate.getHours(); //获取当前小时数(0-23) myDate.getMinutes...(); //获取当前分钟数(0-59) myDate.getSeconds(); //获取当前秒数(0-59) myDate.getMilliseconds(); //获取当前毫秒数(0-999) myDate.toLocaleDateString...(); //获取当前日期 var mytime=myDate.toLocaleTimeString(); //获取当前时间 myDate.toLocaleString( ); //获取日期与时间 <script

    5.5K20
    领券