Javascript中this关键字的一些小知识
JavaScript中的this关键字与理解
JavaScript,作为现今最流行的跨平台语言之一,充满了无尽的可能性和挑战。前端开发中,我们常常与之打交道,然而有时却发现对它的理解似乎并不如我们所期望的那样深入。尤其是在this关键字时,其隐性的绑定方式和var that = this这样的结构,更是让许多开发者感到困惑。今天,我们就来深入一下这个神秘的关键字。
我们得承认JavaScript在设计中存在一些看似矛盾的点,这也是由其动态特性所决定的。函数是对象,数组也是对象……这些特性构成了JavaScript独特的设计语言。当我们在使用像add这样的函数时,如果没有显式地绑定上下文(也就是this),那么this会被默认绑定到全局对象上。这就是所谓的隐性绑定。当我们看到如下的代码时:
```javascript
function add (a,b) {return a+b}
var sum = add (3,4);
console.log(sum); // 输出7
```
这里的add函数中的this其实是绑定到了全局对象上。这也带来了一个问题,那就是在某些情况下,我们可能无法预期函数中的this指向何处,这就造成了一些所谓的“Bug”。为了解决这个问题,我们可以使用var that = this这样的方式,创建一个对当前上下文的引用,这样在我们需要的时候就可以通过那个变量访问到上下文中的属性和方法。比如下面的例子:
```javascript
var M = function(){
this.name = "M";
};
var MM = function(){
var z = new M(); // 创建新的M对象实例z
this.name = "MM"; // this指向MM的实例对象本身
var self = this; // 创建当前上下文的别名self
z.printName = function(){ // 在z对象上添加一个方法printName
console.log(self.name); // 打印MM对象的name属性,而非z对象的name属性
};
return z.printName(); // 返回printName函数的执行结果
};
var mm = new MM(); // 创建新的MM对象实例mm并调用它,输出MM对象的name属性值"MM"
```
编码世界中的高阶函数与绑定奥秘
在编程的世界里,我们时常遇到一些充满神秘色彩的概念,它们如同深邃的宇宙中的星辰,引导我们未知的领域。今天,让我们来揭开高阶函数与绑定的面纱,洞悉它们背后的奥秘。
让我们从函数绑定开始。在JavaScript中,bind方法是一个强大的工具,它可以将方法绑定到特定的接收者对象上。让我们来看一个例子:
有一个名为MM的函数,内部创建了一个M对象实例并将其赋值给变量z。接着,它定义了一个名为printName的方法,并使用bind方法将该方法绑定到MM对象上。当调用printName方法时,它将通过console.log输出MM的名称。MM函数返回调用printName的结果。这就是bind的强大之处,它允许我们控制方法的执行上下文。
接下来,让我们来谈谈高阶函数。高阶函数是接受其他函数作为参数或返回其他函数的函数。这种概念在函数式编程中非常常见,也是编程中一种强大的技术。它们可以帮助我们编写更灵活、模块化的代码。
在偶然的机会中,你可能会遇到类似于print('Hello')('World')的代码,这实际上就是一个高阶函数的示例。这里的print是一个接受一个函数作为参数的函数,当传入'Hello'和'World'两个参数时,它会依次执行这两个参数代表的函数,最终输出'Hello, World'。这种用法不仅简洁而且富有表现力。
还有一个名为cambrian.render('body')的代码片段,这可能是某种库或框架的调用方式,用于渲染或操作页面元素。具体细节需要依据上下文或相关文档来确定。
高阶函数和绑定是编程中的高级技巧,它们可以使我们的代码更灵活、模块化,并帮助我们更好地组织和管理代码。如果你对这些概念感兴趣,不妨深入一下,它们将带你开启编程世界的新篇章。
编程语言
- Javascript中this关键字的一些小知识
- form表单数据封装成json格式并提交给服务器的实现
- Vscode中快速创建自定义代码模板的方法
- 重写 ajax 实现 session 超时跳转到登录页面实例代
- php简单操作mysql数据库的类
- PHP中垃圾回收相关函数的使用
- vue 不使用select实现下拉框功能(推荐)
- 用PHP解决的一个栈的面试题
- DIV+CSS经常用到的属性、参数及说明
- Vue.js项目实战之多语种网站的功能实现(租车)
- jsp base标签与meta标签学习小结
- vue使用rem实现 移动端屏幕适配
- 不错的主要用于加密的vbs(asp)位移运算类
- node打造微信个人号机器人的方法示例
- 使用vue2.0创建的项目的步骤方法
- Thinkphp 框架扩展之标签库驱动原理与用法分析