Web前端刷题笔记集萃：10.17—剖析JS核心要点

目录

1. 严格比较
2. 跨域与同源
3. 冒泡与捕获
4. Object.defineProperty(obj, prop, desc)
5. Math.ceil()

1. 严格比较

严格比较会同时比较值和类型，使用===和!==运算符。

2. 跨域与同源

跨域是指访问不同协议、端口或主机的资源。同源是指访问相同协议、端口和主机的资源。

3. 冒泡与捕获

事件冒泡是指事件从目标元素沿着DOM树向上传播，直到被捕获。捕获是指事件从目标元素沿着DOM树向上传播，直到到达指定元素。

4. Object.defineProperty(obj, prop, desc)

用于给对象定义或修改属性，desc参数指定属性的，可设置其可枚举性、可写性、可配置性、getter和setter函数。

5. Math.ceil()

向上取整，将数字舍入为最接近的整数，如果为正数则向上取整，为负数则向下取整。

深入解析

1. 严格比较

console.log(1 === "1"); // false
console.log(1 !== "1"); // true

2. 跨域与同源

// 跨域请求
fetch("https://example.com/api").then(res => res.json());

// 同源请求
fetch("/api").then(res => res.json());

3. 冒泡与捕获

<div id="parent">
  <button id="child">按钮</button>
</div>

<script>
  document.getElementById("parent").addEventListener("click", () => {
    console.log("父元素捕获事件");
  }, true);

  document.getElementById("child").addEventListener("click", () => {
    console.log("子元素触发事件");
  });
</script>

4. Object.defineProperty(obj, prop, desc)

const obj = {};

Object.defineProperty(obj, "name", {
  value: "John",
  writable: true,
  enumerable: true,
  configurable: true,
  get() {
    return this._name;
  },
  set(value) {
    this._name = value;
  }
});

5. Math.ceil()

console.log(Math.ceil(1.5)); // 2
console.log(Math.ceil(-1.5)); // -1

总结

本文深入解析了Web前端刷题中常见的JS核心要点，帮助开发者牢固掌握这些知识点，提升自己的编程技能。通过持续的练习和深入的理解，相信各位开发者都能成为Web前端领域的佼佼者。