这个 J-Query 扩展 textArea 的 JS 是否合适？ 'this' 和 JS 中的 event.target 一样吗？

Question

我运行在代码笔上扩展了 textArea，https://codepen.io/vsync/pen/frudD 它似乎运行良好。驱动它的代码是：

$(document)
    .one('focus.autoExpand', 'textarea.autoExpand', function(){
        var savedValue = this.value;
        this.value = '';
        this.baseScrollHeight = this.scrollHeight;
        this.value = savedValue;
    })
    .on('input.autoExpand', 'textarea.autoExpand', function(){
        var minRows = this.getAttribute('data-min-rows')|0, rows;
        this.rows = minRows;
        rows = Math.ceil((this.scrollHeight - this.baseScrollHeight) / 16);
        this.rows = minRows + rows;
    });

我运行将其归入Javascript如下。这似乎也运行良好，我在控制台上没有收到任何错误：

<!DOCTYPE html>
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
<textarea class='autoExpand' rows='3' data-min-rows='3' placeholder='Auto-Expanding Textarea'></textarea>

  <script>
    'use strict'; 
    function handler_focusin(e){
      let savedValue = e.target.value;
      e.target.value = '';
      e.target.baseScrollHeight = e.target.scrollHeight;
      e.target.value = savedValue;
    }
    function handler_input(e){
      let minRows = e.target.getAttribute('data-min-rows')|0, rows;
      e.target.rows = minRows;
      rows = Math.ceil((e.target.scrollHeight - e.target.baseScrollHeight) / 16);
      e.target.rows = minRows + rows;
    }
    let els = document.getElementsByClassName("autoExpand");
    [...els].forEach( el => {
      el.addEventListener('focusin', handler_focusin);
      el.addEventListener('input', handler_input);
    })
  </script>
</body>

问题：

看function_handler中的第一条语句（在JS版本和对应的jQuery中都是）。那里有一个未声明的符号 'rows'。有一个逗号运算符，所以我希望对行进行评估，但控制台中没有错误。然后下行的两个语句被分配给，同样没有声明也没有错误。

此外，为什么还要使用逗号运算符，因为行是最后计算的并且 returned？
在同一条语句中，我收集到 'data-min-rows' 可能是程序员定义的属性，因此除非已添加，否则它将 return 未定义。我想 bitwise OR 和后面的 zero 优先，这个 return 为零。

正确吗？
在jQuery中显然'this'与e.target相同。（在一些参考文献中发现）。然而，当我 t运行设置代码时，我错过了将 'this' 更改为 e.target，但它仍然有效。

在 Javascript 事件处理程序中 this 是否也可靠地 e.target？（我从搜索中找到的参考文献似乎都在谈论 jQuery。）
jQuery 代码还将事件处理程序分配给 textarea.autoExpand，但 'textarea' 不是事件名称。那是做什么的？ Javascript中有对应的东西吗?

Answer 1

var a, b; 声明了 2 个变量，它是 shorthand for var a; var b;.
myVariable | 0 "casts"变量为数字：
"wadsd" | 0 > 0
undefined | 0 > 0
true | 0 > 1
123 | 0 > 123

3：对，this指的是e.currentTarget。 (source)

4：那是 delegated event handler。它使用 class.autoExpand 侦听文本区域上的 'focus.autoExpand' 事件。它已在文档中注册，因此可以在目标元素存在之前注册该事件。

这个 J-Query 扩展 textArea 的 JS 是否合适？ 'this' 和 JS 中的 event.target 一样吗？

Is this proper JS for this J-Query expanding textArea? Is 'this' the same as event.target in JS also?

javascript

jquery

textarea

this

jquery-events