1. Uncaught TypeError: Cannot read property如果你是一个javascript开发者,你肯定看到过此错误读取属性或调用方法的对象的未定义这可能由于许多原因而发生,但常见的是在呈现UI组件时不正确地初始化状态。 让我们看一个在真实应用程序中如何发生这种情况的示例。 我们将选择React,但不正确初始化的相同原则也适用于A ......
87
0
0
2024-02-25
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构数组的解构赋值ES5写法let a = 123; let b = 456; ES6允许写法let [a,b] = [123,456]; 可以从数组中提取值,按照对应位置,对变量赋值只要等号两边的模式相同,左边的变量就会被赋予对应的值eg:let [a,[[b],c]] = [1 ......
104
0
0
2024-02-25
什么是跨域在了解跨域之前,我们必须要了解一下同源策略。 跨域问题其实就是浏览器的同源策略造成的。同源策略同源策略限制了从同一个源加载的文档或脚本如何与另一个源的资源进行交互。这是浏览器的一个用于隔离潜在恶意文件的重要的安全机制。同源指的是:协议、端口号、域名必须一致。跨源资源共享([CORS],或通俗地译为跨域资源共享)是一种基于 [HTTP] 头的机制,该 ......
102
0
0
2024-02-21
前言call、apply和bind都是JavaScript中Function对象的原型方法,它们的作用主要是改变函数的执行上下文(即this的值)以及传递参数。什么是js上下文在讲解这三个方法之前,我先需要了解一下什么是js的上下文。执行上下文是JavaScript中的一个重要概念,它是一段代码被执行时的环境。它包含了当前执行环境中的所有信息,如变量、函数声 ......
100
0
0
2024-02-21
二、同步代码和异步代码的应用1. 同步代码的应用同步代码的应用主要是在一些简单的操作中,比如数组的遍历、字符串的操作等。这些操作不需要等待其他操作的结果,可以按照代码的顺序依次执行。例如,下面的代码展示了一个简单的同步代码的例子。代码中,首先定义了一个数组,然后使用for循环遍历数组中的元素,并输出每个元素的值。var arr = [1, 2, 3, 4, ......
82
0
0
2024-02-21
前言chrome.storage 和 localStorage 都是在浏览器中用于存储数据的机制,下面我们一起聊聊它们是什么,区别以及使用示例。localStorageHTML5标准中,Web Storage API 提供了可以存储键值对的机制,包含 sessionStorage 和 localStorage 分别对应临时存储和永久存储。sessionSto ......
111
0
0
2024-02-20
Chrome 拓展(Chrome Extension)是什么Chrome Extension 实际上就是大多数人所说的 Chrome 插件,但是从标准上来说 Chrome 插件是浏览器更底层的拓展功能开发,而我们使用的应该叫 Chrome 拓展(Chrome Extension)。Chrome 拓展是为 Chrome 浏览器设计和开发的小型软件程序,用于增强 ......
114
0
0
2024-02-20
前言 创建文件const fs=require("fs") fs.mkdir("./geyao",(err)=>{ console.log(err) if(err&&err.code==="EEXIST"){ console.log("目录已经存在") } }) 运行结果重命名c ......
80
0
0
2024-02-20
cropperjs的主要功能是图片裁剪,是一款前端常用的的图片裁剪工具,可根据相关api配置裁剪出符合自己业务需要的图片,具体使用如下:npm 引用npm i cropperjs 1业务中引入import Cropper from 'cropperjs'; 1文件中单独引入方式<link href="/path/to/cropper.css" r ......
101
0
0
2024-02-19
本月,Ruby on Rails 作者 DHH 宣布移除其团队开源项目 Turbo 8 中的 TypeScript 代码。他认为,TypeScript 对他来说只是阻碍。不仅因为它需要显式的编译步骤,还因为它用类型编程污染了代码,很影响开发体验。无独有偶,不久前,知名前端 UI 框架 Svelte 也宣布从 TypeScript 切换到 JavaScript ......
86
0
0
2024-02-17
前端框架之前接触过不少,目前在用Layui比较顺手;不过也遇到不少雷和坑。这里就分享一下那些雷和坑。。首先说一下表格中有时候ID或NAME是无法取值,只能通过lay-filter指定一个name,然后获得。例如:<select id="Device_Type" name="Device_Type" lay-filter='Device_Type'&gt ......
82
0
0
2024-02-16
在这个软件主导的世界里,如何提高编程效率,成为了每位开发者必须面对的课题。正如史蒂夫·麦康奈尔(Steve C McConnell)所说:“等待一位高效的程序员变得可用,比等待第一个可用的程序员变得高效要好。” 这句话强调了软件工程师角色中效率的重要性。随着项目日益复杂和对高质量代码的需求增加,开发者们都在寻找能简化他们工作流程的工具。应对这一需求,Visu ......
220
0
0
2024-02-14
前端工程化配置指南本文讲解如何构建一个工程化的前端库,并结合 Github Actions,自动发布到 Github 和 NPM 的整个详细流程。示例我们经常看到像 Vue、React 这些流行的开源项目有很多配置文件,他们是干什么用的?他们的 Commit、Release 记录都那么规范,是否基于某种约定?废话少说,先上图!上图标红就是相关的工程化配置,有 ......
113
0
0
2024-02-11
扩展操作符 … 是ES6中引入的,将可迭代对象展开到其单独的元素中,常见的应用场景有:拷贝数组对象,合并数组,参数传递,数组去重,字符串转字符数组,解构变量等单纯的学习某个技术知识点,很容易的,但是能在实际项目中运用进去,那就不简单了的单纯的学习某个语言的语法,都相类似,但是多种技术融合起来,那就复杂了的应用场景解构参数,传递参数向后端接口传递参数,拼接参数 ......
92
0
0
2024-02-10
在有一些网站示例产品里面,为了比较处理之前和之后的一个效果对比图那么就可以使用这个特效示例效果原生Js实现<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>有趣的拖动黑白对比图片特效</ ......
95
0
0
2024-02-10