Javascript FAQ

buuug7 — Sun, 12 Apr 2020 15:20:11 +0000

创建自定义事件

CustomEvent

let customEvent = new CustomEvent('custom-evt', {
  detail: { someKey: 'value..' }
});

document.dispatchEvent(customEvent);

// 捕获事件
document.addEventListener('custom-evt', function(e) {
  console.log(e.detail);
});

Node.textContent 属性可以表示一个节点及其后代节点的文本内容

var text = element.textContent;
element.textContent = 'this is some sample text';

// 给定如下HTML:
//   <div id="divA">This is <span>some</span> text</div>

// 获得文本内容:
var text = document.getElementById('divA').textContent;
// |text| is set to "This is some text".

// 设置文本内容:
document.getElementById('divA').textContent = 'This is some text';
// divA的HTML现在是这样的:
// <div id="divA">This is some text</div>

什么是弱类型的

Loose typing means that variables are declared without a type.
弱类型指的是在申明变量的时候不指定变量的类型

/*JavaScript Example(loose typing)*/
var a=13;// Number declaration
var b="thirteen";// String declaration

/*Java Example(Strong typing)*/
int a=13; // int declaration
string b="thirteen"; // String declaration

什么叫纯函数

一个函数的返回结果只依赖于它的参数，并且在执行过程里面没有副作用，我们就把这个函数叫做纯函数。

什么叫 shim

shim 垫片的意思，指把一个库引入另一个旧的浏览器，然后用旧的 API 来实现一些新的 API 功能。

常见 DOM 的操作

  // DOM查找
  let ul = document.querySelector('ul');
  let firstChild = document.querySelector('ul li:first-child');

  // DOM创建 Element
  // element = document.createElement(tagName[, options]);
  let newLi = document.createElement('li');
  newLi.textContent = '5 ipsum amet.';

  // DOM 创建 textNode
  let textNode = document.createTextNode('pu guohong');
  document.body.appendChild(textNode);

  // DOM 添加
  // element.appendChild(aChild);
  ul.appendChild(newLi);

  // DOM 替换
  // 返回的是被移除的DOM
  // replacedNode = parentNode.replaceChild(newChild, oldChild);
  let r = ul.replaceChild(newLi, firstChild);
  console.log(r);

  // DOM 移除
  // 移除第二个li
  // oldChild = node.removeChild(child);
  // or node.removeChild(child);
  ul.removeChild(ul.children[1]);

  // 插入
  // insertedNode = parentNode.insertBefore(newNode, referenceNode);
  ul.insertBefore(newLi, ul.lastElementChild);

  // dupNode = node.cloneNode([deep]);
  // deep=true|false
  let cloneUl = ul.cloneNode(true);
  document.body.appendChild(cloneUl);