Page 1

文本框输入，p标签的内容自动变成文本框的内容

/**
* 使用addEventListener
* 首先获取标签和文本框的元素，然后为文本框添加一个监听器，在发生改变时，更改p标签的文本
* 
**/

<input type="text" id="onchange" value="input">
  <p id="on_change">input</p>

  <script>
  const input = document.getElementById('onchange');
  const p = document.getElementById('on_change');
  input.addEventListener('input', function () {
    p.textContent = input.value;
  });
</script>

/**
* 使用onchange和oninput
* onchange：在修改失去焦点时触发
* oninput： 会在元素发生变化时立即触发
* 
**/
<div id="div1"><!--非vue-->
JS的onchage事件：
<input type="text" id="t1" onchange="p1()">
<p id="pp">原始值</p>
</div>
<script>
function p1(){
    var lb_p=document.getElementById("pp");
    var txt_t1=document.getElementById("t1").value;
    lb_p.innerHTML=txt_t1;}
</script>

<div id="div2"><!--非vue-一些ie低版本不支持-->
JS的oninput事件：
<input type="text" id="t2" oninput="p2()">
<p id="pp2">原始值</p>
</div>
<script>
function p2() {
        var lb_p=document.getElementById("pp2");
        var txt_t2=document.getElementById("t2").value;
        lb_p.innerHTML=txt_t2;
}
</script>

oninput 和 onchange 是事件属性，addEventListener 是方法，可以添加多个事件监听器

个人理解：
oninput 和 onchange是直接的事件，触发这个事件时调用他指定的方法，
而 addEventListener 添加的监听器中，第一个参数指定事件，后面的参数是调用的方法。

/**
* 在 react 中实现
*
**/

function App() {
  const [text, setText] = useState('');

  const handleChange = (event) => {
    setText(event.target.value);
  };

  return (
    <div>
      <input type="text" value={text} onChange={handleChange} />
      <p>{text}</p>
    </div>
  );
}

数组与树的相互转换

/** 数组结构数据 */
const arrayData = [
  { id: 2, title: '中国', parent_id: 0 },
  { id: 3, title: '广东省', parent_id: 2 },
  { id: 4, title: '广州市', parent_id: 3 },
  { id: 5, title: '天河区', parent_id: 4 },
  { id: 6, title: '湖南省', parent_id: 2 },
  { id: 1, title: '俄罗斯', parent_id: 0 }
]


function getChildren(data, result, pid) {
  for (const item of data) {
    if (item.parent_id === pid) {
      const newItem = { children: [], ...item }
      result.push(newItem)
      getChildren(data, newItem.children, item.id)
    }
  }
}

function arrayToTree(data, pid) {
  let result = []
  getChildren(data, result, pid)
  return result
}

console.log(arrayToTree(arrayData, 0));

/** 树状形结构数据treeData */
const treeData = [
  {
    id: 2, title: '中国', parent_id: 0,
    children: [
      {
        id: 3, title: '广东省', parent_id: 2,
        children: [
          {
            id: 4, title: '广州市', parent_id: 3,
            children: [
              { id: 5, title: '天河区', parent_id: 4 }
            ]
          }
        ]
      },
      { id: 6, title: '湖南省', parent_id: 2 }
    ]
  },
  { id: 1, title: '俄罗斯', parent_id: 0, },
]

function treeToList(data) {
        let res = [];
        const dfs = (tree) => {
            tree.forEach((item) => {
                if (item.children) {
                    dfs(item.children);
                    delete item.children;
                }
                res.push(item);
            });
        };
        dfs(data);
        return res;
}

手写promise.all

/**
 * @param {Array<Function>} functions
 * @return {Promise<any>}
 */
var promiseAll = function(functions) {
   return new Promise((resolve,reject)=>{
       if(functions.length===[]){
           resolve([]);
           return
       }
    
       const res=new Array(functions.length).fill(null)

       let resolvedCount=0

       functions.forEach(async(el,idx)=>{
           try{
               const subResult=await el()
               res[idx]=subResult
               resolvedCount++
               if(resolvedCount===functions.length){
                   resolve(res)
               }
           }catch(err){
               reject(err)
           }
       })
   })
};

/**
 * const promise = promiseAll([() => new Promise(res => res(42))])
 * promise.then(console.log); // [42]
 */

大数相加

let a = "9007199254740991";
let b = "1234567899999999999";

function add(a ,b){
   //取两个数字的最大长度
   let maxLength = Math.max(a.length, b.length);
   //用0去补齐长度
   a = a.padStart(maxLength , 0);//"0009007199254740991"
   b = b.padStart(maxLength , 0);//"1234567899999999999"
   //定义加法过程中需要用到的变量
   let t = 0;
   let f = 0;   //"进位"
   let sum = "";
   for(let i=maxLength-1 ; i>=0 ; i--){
      t = parseInt(a[i]) + parseInt(b[i]) + f;
      f = Math.floor(t/10);
      sum = t%10 + sum;
   }
   if(f == 1){
      sum = "1" + sum;
   }
   return sum;
}