Question

以下是相关代码的一部分：

!function($){
    const figure = name => f => $(`<figure data-name="${name}"><img src="${URL.createObjectURL(f)}"><figcaption><input type=checkbox checked><br>${f.name}</figcaption></figure>`).data("f",f);

 $(document).on("change", "[data-preview-to]", function() {
        $($(this).data("preview-to")).append($.map(this.files, figure(this.name)));
        $(this).replaceWith(this.outerHTML);
***OTHER CODE FOR SUBMIT****
 }(jQuery);

HTML
 <input type="file" data-preview-to="#preview" multiple="" name="fileToUpload[]">

第一个问题，＆＃34;！函数（$）＆＃34;对我来说这说，我不是一个函数，因为＆＃34;！＆＃34;是不是，但这不可能是因为你为什么要声明一个函数，这不是一个函数，然后我想，它可以说＆＃34;这样做，即使文档没有准备好＆＃34;因为（我认为）函数（$），是文档准备好的简写。

然而，函数结束，有一个（jquery），这是必需的，如果我删除它，代码失败，所以这必须做某事，这不是完全JQuery。

第二个问题，是变量＆＃34;数字＆＃34;，我读它的方式，没有意义是＆＃34;声明数字为常数，取名字的值，将其推入f然后将所有内容推送到HTML代码中。但是，我不知道＆＃34; f＆＃34;是如何分配的。我知道它来自＆＃34; $。map（this.files，figure（this.name））＆＃34;，但它看起来像是唯一被发送到数字的是名称（fileToUpload [ ]）HTML输入标记。

这段代码说什么和做什么？

谢谢，

戴夫

Answer 1

第一个是内联调用函数表达式。 !用于将解析器从期望语句转移到期望表达式，以便function启动函数表达式而不是函数声明（这就是我们可以立即调用它的原因）。详情in this question's answers。在函数结束后使用jQuery传入()，并作为$参数接收。

figure是一个ES2015 +（又名“ES6”）arrow function（具体来说，一个箭头函数返回一个箭头函数，其中包含template literal [反引号{{1 }} 在里面]）。在这种情况下，由于此特定函数不使用${...}或this或其他一些东西，因此它大致相当于此ES5及早期代码：

arguments

Answer 2

<强>！函数（）{}（）

!function(){}(argument);表示立即调用已创建的函数。

函数声明function(){}返回undefined。如果我们尝试即时调用此函数

function () {} ()

它将抛出SyntaxError。通过使用！在函数之前的运算符，js将其理解为表达式并成功运行函数

!function () {} ()

<强> =＆GT;箭头功能

const figure = name => f => $()

// is equal to 
const figure = function(name){
   return function(f){
       return $();
   }
}

箭头功能允许编写短代码。箭头函数由正常函数中的参数head和body组成。

(arg1, arg2) => {
    return 4;
}

不再需要写function。参数以标准方式传递，括号如(arg1, arg2) => {}，或者如果只有一个参数 - 只能有参数arg => {}。

正文中的代码可以是正常的＆＃34;阻止正文＆＃34;，就像在正常的函数中一样。如果只有一个 - 返回表达式，则函数可能具有＆＃34;简洁的正文＆＃34;

(arg1, arg2) => return 4;

因此，如果您只有一个参数和一个正文表达式，箭头函数可能会采用简短但不寻常的形式

var sqr = x => x*x;

// equal to
var sqr = function(x){
    return x*x;
}

这个JQuery代码做了什么 - ！function（$）和var = var =＆gt; var =＆gt;

2 个答案: