tag 前端

標籤
貢獻1,072
2892
06:37 AM · Oct 27 ,2025
tuzixiansen_63d4d65909d62 頭像 smileZAZ 頭像 qaz666 頭像 opentiny 頭像 invalidnull 頭像 dirackeeko 頭像 beishangdejianjidan_cqxuxf 頭像 yayu 頭像 junxiudetuoba 頭像 jdcdevloper 頭像 icecreamlj 頭像 xixindehongjiu 頭像

@前端 / 博客 RSS 訂閱

sigui_5f58bd7ced379 頭像

周翔宇 - JavaScript——數組的reduce方法

JavaScript的reduce和reduceRight的作用是通過順序或逆序遍歷數組，從而得到一個結果，原理如下： function myReduce(execute, initValue) { const length = this.length let result for (let i = 0; i length; i++) { if (i =

數組 , reduce , 數組去重 , 前端 , Javascript

收藏 評論

yixiyidong 頭像

卡牌大師 - 前端本地開發，URL如何設置？

一、問題背景 前後端分離的 web 項目，前端本地開發的 URL 大多是“http+localhost+端口”，如 http://localhost:3000。用此 URL 開發，會遇到三類問題。一是跨域，二是 cookie 種植，三是調用外部服務需要真實域名。 跨域問題。如果你遇到跨域問題，大概率就會看過如下圖片，此時瀏覽器不讓你把請求發送到出去。 為什麼會這樣？背後的原因是瀏覽器的同源策略（

代理 , 前端 , url

收藏 評論

invalidnull 頭像

註銷 - 關於 PWA url 參數 ngsw-bypass=true

"ngsw-bypass-true" 這個參數是與 Angular Service Worker (ngsw) 相關的一個選項，用於控制在 Service Worker 中是否繞過緩存，直接請求網絡資源。在 Angular 應用中，Service Worker 主要負責緩存應用的靜態資源，以提高應用的性能和用户體驗。 首先，讓我們瞭解一下 Angular Service Worker 的基本概念。

ecmascript-6 , pwa , typescript , 前端 , Javascript

收藏 評論

chongdianqishi 頭像

機器馬 - ReactRouter6 的一些坑點

問題 這幾年忙着寫 Taro 相關業務，所以很久沒有再接觸 ReactRouter 了。從當年使用的 ReactRouter v3 VueRouter v2，功能和寫法都沒什麼差別，而到現在的 ReactRouter v6，就感覺變化十分大。這裏從使用者的角度聊聊，初次上手 v6 的感受和如何應對這些變化。 變化 範式 函數化和標準化，讓其源碼減少了一半 v6 全面擁抱 Hooks，API

react , react-router , 前端

收藏 評論

liuyuedekele 頭像

六月的可樂🥤 - 智能API代碼示例生成工具AiRestful

一、產品介紹 AiRestful是一款基於智能AI的,幫助小白快速生成任意編程語言的API接口調用示例代碼的編程工具.它的特點是:簡單易用、集成支持、多主流編程語言覆蓋.它是面向學生、編程愛好者、編程小白的實用工具. AiRestful官網: 點擊直達AiRestful官網 二、如何使用 AiRestful是簡單易用的,只需要三步即可為您生成您需要的編程語言的代碼示例. 1、第一步(必須): 根

restful , 人工智能 , 深度學習 , 前端 , Javascript

收藏 評論

lengcang 頭像

茶色島 - JavaScript面向對象

一：面向對象 1.面向對象基本特徵 封裝：也就是把客觀事物封裝成抽象的類，並且類可以把自己的數據和方法只讓可信的類或者對象操作，對不可信的進行信息隱藏 繼承：通過繼承創建的新類稱為“子類”或“派生類”。繼承的過程，就是從一般到特殊的過程 多態：對象的多功能，多方法，一個方法多種表現形式 2.javascript和麪向對象 javascript是一種基於對象（objec

oop , 前端 , Javascript

收藏 評論

gomi 頭像

Gomi - Astro + NextUI 搭建個人博客（導航組件篇）

Astro 簡介 由於我之前的個人博客是Vue3+Quasar+Koa+MySql搭建的，整體就是SPA的思路，作為練手倒是可以鍛鍊前後端各方面的能力。但考慮到後期的遷移和更新等，實在過於麻煩，個人博客其實使用SSR或SSG之類的框架就行了，比如Nextjs，Nuxtjs，Remix等等。於是我接觸到了Astro這個框架，它厲害的是不與任何前端框架進行強行綁定，比如Nextjs是與React強綁定

astro , ssg , ssr , 博客搭建 , 前端

收藏 評論

gqkmiss 頭像

月恆 - Chrome 瀏覽器插件 Manifest.json V3 中權限（Permissions）字段解析

本文參與了SegmentFault 思否 2023 年度有獎徵文活動，歡迎正在閲讀的你也加入。 一、權限（Permissions） 再使用拓展程序的 API 時，大多數的時候，需要在 manifest.json 文件中聲明 permissions 字段。 一、權限類型 在 V3 版本中可以聲明以下類別的權限： permissions： 包含下面 permissions 權限列

2023-年度總結 , permissions , 瀏覽器 , chrome-extension , 前端

收藏 評論

gqkmiss 頭像

月恆 - Chrome 瀏覽器插件從 Manifest V2 升級到 V3 版本所需要修改的點

本文參與了SegmentFault 思否 2023 年度有獎徵文活動，歡迎正在閲讀的你也加入。 一、Manifest V2 支持時間表 Chrome 瀏覽器官方已經給出確定的時間來棄用 V2 版本的插件了。 最早從 2024 年 6 月的 Chrome 127 開始，我們將開始停用 Chrome 的不穩定版本（開發者版、Canary 版和 Beta 版）中的 Manifest V2 擴展程序。

2023-年度總結 , manifest.json , 瀏覽器 , chrome-extension , 前端

收藏 評論

gqkmiss 頭像

月恆 - Chrome 瀏覽器插件 V3 版本 Manifest.json 文件全字段解析

本文參與了SegmentFault 思否 2023 年度有獎徵文活動，歡迎正在閲讀的你也加入。 Chrome 瀏覽器插件 V3 版本 Manifest.json 文件全字段解析 Manifest.json 文件格式 每個擴展程序的根目錄中都必須有一個 manifest.json 文件，其中列出了有關該擴展程序的結構和行為的重要信息。 1、Demo 展示 1. 最小文件 { "manife

2023-年度總結 , manifest.json , chrome-extension , manifest , 前端

收藏 評論

grewer 頭像

Grewer - V8 入門記錄二：環境與調試

環境搭建 這裏先説下我的環境， 這是代碼運行的前提。 系統： Mac Monterey 12.6.8 Xcode: 14.2 Python: 3.11.6 （不要使用 2.x 版本！） 建議全程指令都在FQ工具下進行 由源碼構建 V8 首先我們需要一個工具 depot_tools 執行指令克隆，這裏我是在文件夾 /Users/apple/Sites/demo/depot_tools

v8 , v8js , chrome , 前端 , Javascript

收藏 評論

invalidnull 頭像

註銷 - PWA 架構下文件 hash 的重要作用介紹

在PWA（Progressive Web App）體系架構下，文件 hash 起着非常關鍵的作用，它主要用於緩存管理、版本控制以及確保 Web 應用程序的可靠性。在前端開發中，文件 hash 是文件的唯一標識符，通常是文件內容的哈希值，例如 MD5 或 SHA-256。以下是文件 hash 在 PWA 中的幾個關鍵作用： 1. 緩存管理： 文件 hash 在 PWA 中用於實現緩存策略，確保在更新

ecmascript-6 , pwa , 前端 , html5 , Javascript

收藏 評論

jianer 頭像

健兒 - 多級數組Tree如何做搜索

兩種方案 1、數組打平，根據搜索字符在打平數組裏去filter出滿足條件的node節點，但此時被篩選的節點只有子節點，然後再通過被篩選出的子節點去找對應的父節點，然後拿到結果後轉成tree結構 優點：思路簡單，打平數組用了遞歸，好理解 缺點：找父節點的時候相對麻煩。 2、寫一個遞歸算法，滿足條件就返回tree 比如有一個簡單個tree const treeData = [ {

遞歸 , tree , 算法 , 前端

收藏 評論

skychx 頭像

鹵代烴 - ⚡️ [性能優化] 瀏覽器跨域帶來的一些性能問題

前言 字節 Web Infra 團隊最近開啓新一輪招聘了，如果你對 Web Framework/Runtime/Performance，或對編譯構建/Rust/AI 感興趣，可以來看看我們的崗位（具體崗位信息可以看這個招聘鏈接 👉 字節跳動 Web Infra - Web Solutions 團隊招人啦！） 簡歷可以發到我的郵箱 skychx@hotmail.com，我可以幫你內推崗位並跟

性能優化 , 跨域 , 前端

收藏 評論

nanchengfe 頭像

南城FE - Nodejs - 9步開啓JWT身份驗證

本文翻譯自 9 Steps for JWT Authentication in Node.js Application，作者：Shefali， 略有刪改。 身份驗證是Web開發的重要組成部分。JSON Web令牌（JWT）由於其簡單性，安全性和可擴展性，已成為在Web應用程序中實現身份驗證的流行方法。在這篇文章中，我將指導你在Node.js應用程序中使用MongoDB進行數據存儲來實現JWT

node.js , 前端 , Javascript , Jwt

收藏 評論

chenchaoyang666 頭像

愚者 - 基於tiptap一次封裝CustomEditor

tiptap一次封裝自定義UI 效果圖 （參考element-tiptap）： demo如下 本次封裝基於vue3 template div v-if="editor" :class="[ { 'el-tiptap-editor': true, 'el-tiptap-editor--fullscreen': isFullscreen

vue.js , less , typescript , 前端

收藏 評論

apifox 頭像

Apifox - 提高開發效率：Mock.js 數據模擬實戰教程

在本篇文章中，我們將深入探討Mock.js，這是一款在前端開發中廣泛應用的工具庫，專門用於生成模擬數據和攔截 Ajax 請求。本文將從以下幾個角度展開討論 Mock.js 的功能和應用： 如何開始使用 Mock.js 創建模擬數據 應用數據模板 模擬 Ajax 請求的技巧 開始使用 Mock.js 首要步驟是將 Mock.js 集成到你的項目中，這可以通過下面的 npm 命令來完成：

mock.js , mock , mockito , 前端工程師 , 前端

收藏 評論

laomao_5902e12974409 頭像

來了老弟 - 一篇搞定面試中的跨域問題

什麼是CORS（跨源資源共享）？ CORS（Cross-Origin Resource Sharing）是一種機制，允許網頁從不同的域訪問服務器上的資源。 在同源策略下，瀏覽器限制了跨域訪問，CORS允許服務器指定哪些源可以訪問其資源。 同源策略(Same-origin policy) 同源策略在web應用安全模型中是一個重要的概念。在這個策略下，瀏覽器允許第一個網頁中包含的腳本可以獲取第二個網頁

cors , 面試問題 , 前端

收藏 評論

xiangjian_659d190d45a7b 頭像

相見 - HarmonyOS—@Observed裝飾器和@ObjectLink嵌套類對象屬性變化

@Observed裝飾器和@ObjectLink裝飾器：嵌套類對象屬性變化 概述 @ObjectLink和@Observed類裝飾器用於在涉及嵌套對象或數組的場景中進行雙向數據同步： 被@Observed裝飾的類，可以被觀察到屬性的變化； 子組件中@ObjectLink裝飾器裝飾的狀態變量用於接收@Observed裝飾的類的實例，和父組件中對應的狀態變量建立雙向數據綁定。這個實例可以是數組中

華為 , 前端工程化 , Android , harmonyos , 前端

收藏 評論

refanbanzhang 頭像

熱飯班長 - fetch的使用記錄

如何用fetch發起post請求 下面是一個用fetch發起的post請求示例： fetch('/api/add', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ name: 'tomcat', }), }) .then(res

fetch , 前端 , Javascript

收藏 評論

apifox 頭像

Apifox - 掌握 Vue3 中的 setup 函數

Vue.js 經歷了從 Vue 2 到 Vue 3 的重大變革，帶來了許多引人注目的新特性和性能優化。其中，setup函數無疑是最引人矚目的新星之一。 一、概覽 setup函數是 Vue 3 引入的一個新的組件選項，作為組合式 API 中心，它允許開發者在一個空間內使用所有的 composition API。這個函數將在組件創建之前執行，這樣就為你提供了定義響應式變量、計算屬性、函數等的機會，從而

vue.js , 前端工程師 , vue3 , 程序員 , 前端

收藏 評論

budebinglin 頭像

阿菇kinoko - JavaScript 原型鏈詳解

繼續補檔，發現這塊內容其實蠻多的。後面估計還會有兩篇（怎麼還有兩篇啊喂！），分別是 JavaScript執行原理·補 和 JavaScript部分特性，這周不知道能不能搞定。 先看 JS 原型鏈吧。 JS 繼承機制設計 1994年，網景公司（Netscape）發佈了 Navigator v0.9，轟動一時。但當時的網頁不具備交互功能，數據的交互全部依賴服務器端，這浪費了時間與服務器資源。 網景公司

web安全 , prototype , constructor , 前端 , Javascript

收藏 評論

aqiongbei 頭像

aqiongbei - javascript中的動態集合NodeList&HTMLCollection

不知道你有沒有在控制枱見到過類似這樣的輸出 我們會發現，同樣都是獲取元素的代碼，為啥一個是NodeList，一個是HTMLCollection。 那麼這倆是啥？又有啥區別，本篇文章我們就聊聊這個。 NodeList NodeList對象是節點的集合(類數組)。通常是由屬性，如Node.childNodes 和 方法（如document.querySelectorAll） 返回的

dom , 前端 , Javascript

收藏 評論

fenanjiu 頭像

南玖 - 使用原生 cookieStore 方法，讓 Cookie 操作更簡單

前言 對於前端來講，我們在操作cookie時往往都是基於document.cookie，但它有一個缺點就是操作複雜，它並沒有像localStorage那樣提供一些get或set等方法供我們使用。對與cookie的操作一切都是基於字符串來進行的。為了讓cookie的操作更簡便， Chrome87率先引入了cookieStore方法。 document.cookie document.cookie可以

cookie , 前端 , Javascript

收藏 評論