JavaScript中"=>"(由等于和大于等形成的箭头)的含义是什么?

 从容嘛_100 发布于 2023-01-01 16:32

我知道>=运算符意味着大于或等于,但我=>在一些源代码中看到过.那个运营商的意义是什么?

这是代码:

promiseTargetFile(fpParams, aSkipPrompt, relatedURI).then(aDialogAccepted => {
    if (!aDialogAccepted)
        return;

    saveAsType = fpParams.saveAsType;
    file = fpParams.file;

    continueSave();
}).then(null, Components.utils.reportError);

elixenide.. 530

这是什么

这是一个箭头功能.箭头函数是ECMAscript 6引入的一种简短语法,可以与使用函数表达式的方式类似地使用.换句话说,你经常可以使用它们代替表达式function (foo) {...}.但他们有一些重要的区别.例如,它们不绑定自己的值this(参见下面的讨论).

Arrow函数是ECMAscript 6规范的一部分,但不是当今大多数浏览器中使用的"普通"JavaScript的一部分.但是,它们在Node v.4.0 +和许多浏览器中都有部分支持(见下文).

您可以在Mozilla文档中阅读有关箭头功能的更多信息.

从Mozilla文档:

相比箭头函数表达式(也称为脂肪箭头功能)具有更短的语法函数表达式和词法结合this值(不结合其自身的this,arguments,super,或new.target).箭头功能始终是匿名的.这些函数表达式最适合非方法函数,不能用作构造函数.

关于this箭头函数如何工作的注记

箭头函数最方便的功能之一隐藏在上面的文本中:

箭头函数...词法绑定this值(不绑定自己的this......)

这意味着更简单的说法是箭头函数保留this其上下文中的值并且没有自己的值this.传统的功能确实绑定了自己的this价值,需要许多体操self = this;等来this从另一个功能内的一个功能进行访问或操作.有关此主题的更多信息,请参阅Mozilla文档中的说明和示例.

示例代码

示例(也来自文档):

var a = [
  "We're up all night 'til the sun",
  "We're up all night to get some",
  "We're up all night for good fun",
  "We're up all night to get lucky"
];

// These two assignments are equivalent:

// Old-school:
var a2 = a.map(function(s){ return s.length });

// ECMAscript 6 using arrow functions
var a3 = a.map( s => s.length );

// both a2 and a3 will be equal to [31, 30, 31, 31]

兼容性说明

您可以在Node中使用箭头功能,但浏览器支持不稳定.

浏览器对此功能的支持已经有了相当大的改进,但对于大多数基于浏览器的用法来说,它仍然不够普及.截至2017年12月12日,当前版本支持:

Chrome(v.45 +)

Firefox(v.22 +)

边缘(v.12+)

歌剧(v.32 +)

Android浏览器(v.47 +)

Opera Mobile(v.33 +)

Chrome for Android(v.47 +)

Firefox for Android(v.44 +)

Safari(v.10+)

iOS Safari(v.10.2 +)

三星互联网(v.5+)

百度浏览器(v.7.12 +)

不支持:

IE(通过第11节)

Opera Mini(通过v.8.0)

黑莓浏览器(通过第10节)

IE Mobile(通过v.11)

适用于Android的UC浏览器(通过v.11.4)

QQ(通过v.1.2)

您可以在CanIUse.com上找到更多(和更多当前)信息(无联属关系).

8 个回答
  • 这被称为箭头功能,是ECMAScript 2015规范的一部分 ......

    var foo = ['a', 'ab', 'abc'];
    
    var bar = foo.map(f => f.length);
    
    console.log(bar); // 1,2,3

    语法比上一个更短:

    // < ES6:
    var foo = ['a', 'ab', 'abc'];
    
    var bar = foo.map(function(f) {
      return f.length;
    });
    console.log(bar); // 1,2,3

    DEMO

    另一个很棒的东西是词法 this ...通常,你会做类似的事情:

    function Foo() {
      this.name = name;
      this.count = 0;
      this.startCounting();
    }
    
    Foo.prototype.startCounting = function() {
      var self = this;
      setInterval(function() {
        // this is the Window, not Foo {}, as you might expect
        console.log(this); // [object Window]
        // that's why we reassign this to self before setInterval()
        console.log(self.count);
        self.count++;
      }, 1000)
    }
    
    new Foo();

    但是可以用这样的箭头重写:

    function Foo() {
      this.name = name;
      this.count = 0;
      this.startCounting();
    }
    
    Foo.prototype.startCounting = function() {
      setInterval(() => {
        console.log(this); // [object Object]
        console.log(this.count); // 1, 2, 3
        this.count++;
      }, 1000)
    }
    
    new Foo();

    DEMO

    MDN
    有关语法的更多信息

    有关更多信息,请参阅何时使用箭头函数,这是一个非常好的答案.

    2023-01-01 16:33 回答
  • 这将是ECMAScript 6中引入的"箭头函数表达式".

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/arrow_functions

    出于历史目的(如果Wiki页面稍后更改),它是:

    与函数表达式相比,箭头函数表达式具有更短的语法,并且词汇绑定此值.箭头功能始终是匿名的.

    2023-01-01 16:33 回答
  • 这是什么

    这是一个箭头功能.箭头函数是ECMAscript 6引入的一种简短语法,可以与使用函数表达式的方式类似地使用.换句话说,你经常可以使用它们代替表达式function (foo) {...}.但他们有一些重要的区别.例如,它们不绑定自己的值this(参见下面的讨论).

    Arrow函数是ECMAscript 6规范的一部分,但不是当今大多数浏览器中使用的"普通"JavaScript的一部分.但是,它们在Node v.4.0 +和许多浏览器中都有部分支持(见下文).

    您可以在Mozilla文档中阅读有关箭头功能的更多信息.

    从Mozilla文档:

    相比箭头函数表达式(也称为脂肪箭头功能)具有更短的语法函数表达式和词法结合this值(不结合其自身的this,arguments,super,或new.target).箭头功能始终是匿名的.这些函数表达式最适合非方法函数,不能用作构造函数.

    关于this箭头函数如何工作的注记

    箭头函数最方便的功能之一隐藏在上面的文本中:

    箭头函数...词法绑定this值(不绑定自己的this......)

    这意味着更简单的说法是箭头函数保留this其上下文中的值并且没有自己的值this.传统的功能确实绑定了自己的this价值,需要许多体操self = this;等来this从另一个功能内的一个功能进行访问或操作.有关此主题的更多信息,请参阅Mozilla文档中的说明和示例.

    示例代码

    示例(也来自文档):

    var a = [
      "We're up all night 'til the sun",
      "We're up all night to get some",
      "We're up all night for good fun",
      "We're up all night to get lucky"
    ];
    
    // These two assignments are equivalent:
    
    // Old-school:
    var a2 = a.map(function(s){ return s.length });
    
    // ECMAscript 6 using arrow functions
    var a3 = a.map( s => s.length );
    
    // both a2 and a3 will be equal to [31, 30, 31, 31]
    

    兼容性说明

    您可以在Node中使用箭头功能,但浏览器支持不稳定.

    浏览器对此功能的支持已经有了相当大的改进,但对于大多数基于浏览器的用法来说,它仍然不够普及.截至2017年12月12日,当前版本支持:

    Chrome(v.45 +)

    Firefox(v.22 +)

    边缘(v.12+)

    歌剧(v.32 +)

    Android浏览器(v.47 +)

    Opera Mobile(v.33 +)

    Chrome for Android(v.47 +)

    Firefox for Android(v.44 +)

    Safari(v.10+)

    iOS Safari(v.10.2 +)

    三星互联网(v.5+)

    百度浏览器(v.7.12 +)

    不支持:

    IE(通过第11节)

    Opera Mini(通过v.8.0)

    黑莓浏览器(通过第10节)

    IE Mobile(通过v.11)

    适用于Android的UC浏览器(通过v.11.4)

    QQ(通过v.1.2)

    您可以在CanIUse.com上找到更多(和更多当前)信息(无联属关系).

    2023-01-01 16:33 回答
  • 只是为了添加一个lambda可以在不使用map的情况下做的另一个例子:

    a = 10
    b = 2
    
    var mixed = (a,b) => a * b; 
    // OR
    var mixed = (a,b) => { (any logic); return a * b };
    
    console.log(mixed(a,b)) 
    // 20
    

    2023-01-01 16:33 回答
  • 正如其他人所说,这是一种创建函数的新语法.

    但是,这种功能与正常功能不同:

    他们绑定了this价值.正如规范所解释的那样,

    一个ArrowFunction不适用于定义本地绑定arguments, super,this,或new.target.任何参照arguments, super,this,或new.target的内ArrowFunction必须解析为在词法封闭环境的结合.通常,这将是直接封闭函数的函数环境.

    即使ArrowFunction可能包含对引用的引用super,也不会通过执行MakeMethod将步骤4中创建的函数对象转换为方法.引用的ArrowFunctionsuper 始终包含在非ArrowFunction中,并且super可以通过ArrowFunction的函数对象捕获的作用域访问实现的必要状态.

    他们是非构造者.

    这意味着它们没有[[Construct]]内部方法,因此无法实例化,例如

    var f = a => a;
    f(123);  // 123
    new f(); // TypeError: f is not a constructor
    

    2023-01-01 16:33 回答
  • 这些是箭头功能

    也称为Fat Arrow Functions.它们是编写函数表达式的简洁方法,例如function() {}.

    箭功能可以去除的需要function,return{}定义函数时.它们是单行的,类似于Java或Python中的Lambda表达式.

    没有参数的示例

    const queue = ['Dave', 'Sarah', 'Sharon'];
    const nextCustomer = () => queue[0];
    
    console.log(nextCustomer()); // 'Dave'
    2023-01-01 16:33 回答
  • 我读过,这是Arrow Functionsin 的象征ES6

    这个

    var a2 = a.map(function(s){ return s.length });
    

    使用Arrow Function可以写成

    var a3 = a.map( s => s.length );
    

    MDN文档

    2023-01-01 16:36 回答
  • 使用Arrowfunction添加简单的CRUD示例

     //Arrow Function
     var customers   = [
       {
         name: 'Dave',
         contact:'9192631770'
       },
       {
         name: 'Sarah',
         contact:'9192631770'
       },
       {
         name: 'Akhil',
         contact:'9928462656' 
       }],
    
    // No Param READ
     getFirstCustomer = () => { 
       console.log(this);
       return customers[0];
     };
      console.log("First Customer "+JSON.stringify(getFirstCustomer())); // 'Dave' 
    
       //1 Param SEARCH
      getNthCustomer = index=>{
        if( index>customers.length)
        {
         return  "No such thing";
       }
       else{
           return customers[index];
         } 
      };
      console.log("Nth Customer is " +JSON.stringify(getNthCustomer(1))); 
    
       //2params ADD
      addCustomer = (name, contact)=> customers.push({
         'name': name,
         'contact':contact
        });
      addCustomer('Hitesh','8888813275');
      console.log("Added Customer "+JSON.stringify(customers)); 
    
      //2 param UPDATE
      updateCustomerName = (index, newName)=>{customers[index].name= newName};
      updateCustomerName(customers.length-1,"HiteshSahu");
      console.log("Updated Customer "+JSON.stringify(customers));
    
      //1 param DELETE
      removeCustomer = (customerToRemove) => customers.pop(customerToRemove);
      removeCustomer(getFirstCustomer());
      console.log("Removed Customer "+JSON.stringify(customers)); 
    

    2023-01-01 16:36 回答
撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有