设计模式是为我们编写代码和解决常见问题提供一种框架。 在 JavaScript 中，设计模式可以分为三大类：创建型模式、结构型模式和行为型模式。 下面我们将详细介绍每种模式以及应用场景和代码示例。 创建型模式 创建型设计模式专注于处理对象创建机制，以合适的情况创建对象。这包括了工厂模式、抽象工厂模式、建造者模式、原型模式、单例模式。 工厂模式 工厂模式（Factory Pattern）是一种创建型设计模式，用于创建对象的过程中封装实例化的逻辑。它提供了一种统一的接口来实例化对象，而不需要直接使用构造函数。 应用场景： 当创建对象的过程比较复杂，包含多个步骤或依赖关系时，可以使用工厂模式来将这些 …
将字符串复制到剪贴板 const copyToClipboard = str => { const el = document.createElement(‘textarea’); el.value = str; el.setAttribute(‘readonly’, ”); el.style.position = ‘absolute’; el.style.left = ‘-100%’; document.body.appendChild(el); co …
一、开发者工具检测（Chrome） 这项技术利用的是div元素中的id属性，当div元素被发送至控制台（例如console.log(div)）时，浏览器会自动尝试获取其中的元素id。如果代码在调用了console.log之后又调用了getter方法，说明控制台当前正在运行。 let div = document.createElement(‘div’); let loop = setInterval(() => { console.log(div); console.clear(); }); Object.defineProperty(div,“ …
包管理器 管理着 JavaScript 库，并提供读取和打包它们的工具。 Yarn: Yarn 是由 Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具官网 npm：npm 是 JavaScript 的包管理器。官网 Bower：一个 web 应用的包管理器。官网 component：能构建更好 web 应用的客户端包管理器。官网 spm：全新的静态包管理器。官网 jam：一个专注于浏览器端和兼容 RequireJS 的包管理器。官网 jspm：流畅的浏览器包管理器。官网 Ender：没有库文件的程序库。官网 volo：以项目模板、添加依赖项 …
Window.getComputedStyle()方法返回一个对象，该对象在应用活动样式表并解析这些值可能包含的任何基本计算后报告元素的所有CSS属性的值。 let style = window.getComputedStyle(element, [pseudoElt]); element 用于获取计算样式的Element。 pseudoElt 可选 指定一个要匹配的伪元素的字符串。必须对普通元素省略（或null）。 返回的style是一个实时的 CSSStyleDeclaration 对象，当元素的样式更改时，它会自动更新本身。 getComputedStyle与style的区别 使用el …
Function.prototype.call() call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。 function printThisAndData(…data) { console.log(this.data, …data); } const obj = { data: 0 }; const data = [1, 2, 3]; printThisAndData.call(obj, data); // logs: 0 [1, 2, 3] printThisAndData.call(obj, …data); // logs: 0 1 2 3 …
JSON.stringify() 方法能将一个 JavaScript 对象或值转换成一个 JSON 字符串。 JSON.stringify() 是用于调试的最常见函数。 //初始化一个 user 对象 const user = { “name” : “Prateek Singh”, “age” : 26 } console.log(user); // 结果 // [object Object] 哦！console.log() 没有帮助我们打印出期望的结果。它输出 [object Object]，因为从对象到字符串的默认转换是 [object Object]。因此，我们使用 JSON.stri …
MediaDevices.getUserMedia() 会提示用户给予使用媒体输入的许可，媒体输入会产生一个MediaStream，里面包含了请求的媒体类型的轨道。此流可以包含一个视频轨道（来自硬件或者虚拟视频源，比如相机、视频采集设备和屏幕共享服务等等）、一个音频轨道（同样来自硬件或虚拟音频源，比如麦克风、A/D转换器等等），也可能是其它轨道类型。 <!doctype html> <html> <head> <title>js调用摄像头拍照上传图片</title> <meta charset=“utf-8& …
