跳转到帖子

JavaScript

22个主题在此版块

  1. KaiWn

    JavaScript字符串排序（按名称排序）

    由 KaiWn
    • 1 篇回复
    • 188 次查看

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> <script> let arr = [ { name: "移动", id: 1, children: [ { name: "联通-004", id: 4, children: [{ name: "电信-007", id: 7 }, { …

    Pcasd
    Pcasd的最后回复，
  2. KaiWn

    HTML CSS 和 JavaScript 格式的 3D 玻璃天气图标

    由 KaiWn
    • 0 篇回复
    • 159 次查看

    HTML、CSS 和 JavaScript 格式的 3D 玻璃天气图标 3D玻璃天气图标免费下载 **** 在 HTML、CSS 和 JavaScript 中 HTML： <div class="weather weather--sun"> <div class="icon"> <div class="icon__sun"> <div class="icon__sun-lights"> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> <div class="icon__sun-light"></div> </div> …

    KaiWn
    KaiWn的最后回复，
  3. KaiWn

    [javascript]document的open() write() close()用法

    由 KaiWn
    • 0 篇回复
    • 149 次查看

    1、document.open() 作用：打开一个新文档，即打开一个流，并擦除当前文档的内容。 执行完后会打开一个空的html文档 语法：document.open(mimetype,replace) 参数： mimetype：可选。规定正在写的文档的类型。默认值是"text/html"。 replace：可选。当此参数设置后，可引起新文档从父文档继承历史条目。 document.open("text/html","replace")； 这种形式现在已经弃用；它不会抛出错误，但会直接调用document.open()（相当于无参数形式的调用）。这种历史写入替换行为现在一定会发生 2、document.write() document.write是JavaScript中对document.open所开启的文档流(document stream操作的API方法， 它能够直接在文档流中写入字符串，一旦文档流已经关闭，那document.write就会重新利用document.open打开新的文档流并写入， 此时原来的文档流会被清空，已渲染好的页面就会被清除，浏览器将重新构建DOM并渲染新的页面。 （当页面加载完后，再使用document.write会清空之前的页面） 一.写入文本（页面加载中可以写入，而不会出现重写页面问题） &lt…

    KaiWn
    KaiWn的最后回复，
  4. KaiWn

    JavaScript 特殊数字值 NaN

    由 KaiWn
    • 0 篇回复
    • 143 次查看

    NaN是唯一一个不和自身不相等的值，Array》prototype.indexOf 使用了严格相等，因此不能通过该方法在数组中查找 NaN： NaN === NaN // false [NaN].indexof(NaN); // false 如果想要检查一个值是否为 NaN，必须使用全局函数 isNaN()： isNaN(NaN); // true isNaN(33); // false 但是，isNaN 对非数字不起作用，最好是把 isNaN 和类型检查组合起来： function checkNaN(value) { return typeof value === 'number' && isNaN(value); } 或者，可以检查这个值是否和它本身不相等，因为 NaN 是唯一有这样特征的值： function checkNaN(value) { return vlaue !== value; }

    KaiWn
    KaiWn的最后回复，
  5. KaiWn

    学习 JavaScript (ES6+) 的基础知识

    由 KaiWn
    • 0 篇回复
    • 159 次查看

    您可能已经知道 JavaScript 是一种功能丰富的编程语言，每次更新都会不断增强。 有很多事情要跟上，你可能仍然会发现自己在用旧的方式做事。所以这里有 10 种方法可以让你的 JavaScript 代码现代化。 1. 箭头函数 2. 默认参数 3.对象而不是开关 4. 可选链 5. 解构 6. 三元运算符 7. Nullish 合并操作符 8. 映射和设置 9. Object.hasOwnProperty() 10. 迭代一个对象 1. 箭头函数 传统函数表达式的紧凑替代方案。有一些 局限性 ，就像没有 这个 绑定，但它仍然可以满足您的平均需求。 与箭头函数相比，这是一个传统的匿名函数： 它已经更简洁了，但我们可以做得更好。当函数体由一行组成时，主体括号和 返回 关键字可以省略，所以这里我们隐式返回 一个 + 5 ： (a) => a + 5； 派对并不止于此。当只有一个参数时，我们也可以省略参数括号： a => a + 5; 如果我们需要它是一个命名函数怎么办？我们只是在一个变量中声明它： 常量总和 = a => a + 5; 2. 默认参数 有时您希望可选参数具有默认值。这是在函数调用中省略参数时使用的值。 与使用默认参数相比，这是传统解决方案的样子： 现在简洁了很多。我们可以对箭头函数做同样的事情： const print = (a = 5) => console.log(`数…

    KaiWn
    KaiWn的最后回复，
  6. KaiWn

    什么是 Node.js？

    由 KaiWn
    • 0 篇回复
    • 149 次查看

    什么是 Node.js？ Node.js 是一个开源、跨平台的后端 JavaScript 运行环境，运行在 V8 引擎上，并在 Web 浏览器之外执行 JavaScript 代码，旨在构建可扩展的网络应用程序。 关键点 - Node.js 是一个开源的服务器环境 Node.js 是免费的 Node.js 可在各种平台上运行（Windows、Linux、Unix、Mac OS X 等） Node.js 在服务器上使用 JavaScript Node.js 能做什么？ Node.js 可以生成动态页面内容 Node.js 可以在服务器上创建、打开、读取、写入、删除和关闭文件 Node.js 可以收集表单数据 Node.js 可以添加、删除、修改数据库中的数据 Node.js 非常适合用于： 使用 Node.js 开发的单页 Web 应用程序 Web 服务器后端 移动和桌面应用程序（包括游戏） 机器学习系统或物联网设备的后端 Node.js 的优势是什么？ 巨大的社区支持 可扩展架构 高的 实时应用的性能 节省开发时间和金钱

    KaiWn
    KaiWn的最后回复，
  7. KaiWn

    Javascript学习笔记

    由 KaiWn
    • 0 篇回复
    • 158 次查看

    1.箭头函数 箭头函数是一种更短的函数表达式。 const age = birthyear => 2022 - birthyear; console.log(age(2000)) 箭头左边的birthyear是参数，箭头右边是要执行的代码块。在编写如上单行函数时，我们不需要写花括号，也不需要写return关键字，但实际上这些都是隐式发生的。 多行函数的情况：使用花括号 ' { } ' const years = birthyear => { const age = 2022 - birthyear; const retirement = 65 - age; return retirement; } console.log(years(2000)); 也可以使用多个参数：(brithyear，name) const your_age = (brithyear,name) => { const age = 2022 - brithyear; return `${name},you are ${age} years old `; } console.log(your_age(2000,'soria')); 2. 数组 构造一个数组 const friends = ['mike','adams','pat']; console.log(friends); 使用Arroy函数…

    KaiWn
    KaiWn的最后回复，
  8. KaiWn

    JavaScript实现数字前补“0”的五种方法示例

    由 KaiWn
    • 0 篇回复
    • 161 次查看

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JavaScript 数字前补“0”</title> <body> <script> //迭代方式实现 function padding1(num, length) { for(var len = (num + "").length; len < length; len = num.length) { num = "0" + num; } return num; } //递归方式实现 function padding2(num, length) { if((num + "").length >= length) { return num; } return padding2("0" + num, length) } //转为小数 function padding3(num, length) …

    KaiWn
    KaiWn的最后回复，
  9. KaiWn

    javascript 执行机制（同步、异步、微任务、宏任务）

    由 KaiWn
    • 0 篇回复
    • 167 次查看

    一、关于javascript JS是一门单线程语言，这意味着所有的任务都需要排队，前一个任务结束才会执行后一个任务如果前一个任务耗时很长，后一个任务就不得不一直等着。 这样所导致的问题是： 如果 JS 执行的时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉。 二、同步任务和异步任务 单线程导致的问题就是后面的任务等待前面任务完成，如果前面任务很耗时（比如读取网络数据），后面任务不得不一直等待。 为了解决这个问题，利用多核 CPU 的计算能力，HTML5 提出 Web Worker 标准，允许 JS 脚本实现“多个线程”（JS是单线程这一核心仍未改变。所以一切"多线程"都是用单线程模拟出来的），但是子线程完全受主线程控制。于是，JS 中出现了同步任务和异步任务。 1.同步任务 同步任务：在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务。 比如有五个顾客来到了你的饭店，同步的做法是：先给第一个顾客点菜，然后做菜，结束后再给第二个人…以此类推。 2.异步任务 异步任务：不进入主线程、而进入”任务队列”的任务，当主线程中的任务运行完了，才会从”任务队列”取出异步任务放入主线程执行。 比如有五个顾客来到了你的饭店，异步的做法是：先给每一个顾客点菜，点完之后给他们一个牌子并把对应的菜单放到后厨然后让他们等待，之后后厨根据他们的菜单开始做菜。 三、微任务和宏任务 异步任务又分为微任务和宏任务。 1.微任…

    KaiWn
    KaiWn的最后回复，
  10. KaiWn

    JavaScript变量回收原则/垃圾回收机制

    由 KaiWn
    • 0 篇回复
    • 188 次查看

    先看题目# 下列代码存在几个变量没有被回收？ var i = 1; var i = 2; var add = function() { var i = 0; return function() { i++; console.log(i); } }(); add(); 答案:3,全局变量有两个，即i和add,局部变量有一个i，因为局部变量被另一个作用域引用，所以局部变量i也不回收 var i = 1; // 全局变量不会被回收 var i = 2; // 这里重复声明变量i,因此var声明被忽略，只是把i赋值为2 var add = function() { // 全局变量不会被回收 var i = 0; // 局部变量 return function() { i++; console.log(i); // 被另一个作用域引用导致不会被回收 } }(); add(); 变量回收原则# 全局变量不会被回收。 局部变量会被回收，也就是函数一旦运行完以后，函数内部的东西都会被销毁。 只要被另外一个作用域所引用就不会被回收 JS的垃圾回收机制# 标记清除# JS中最常见的垃圾回收方式是标记清除 标记清除的概念也好理解，从根部出发看是否能达到某个对象，如果能达到则认定这个对象还被需要，如果…

    KaiWn
    KaiWn的最后回复，
  11. KaiWn

    javascript 对特殊符号的转义顺序

    由 KaiWn
    • 0 篇回复
    • 142 次查看

    //反斜杠转移写在最前面，这样就不会影响后面的转换 searchSegment = searchSegment.replace(/\\/g, "\\\\"); searchSegment = searchSegment.replace(/\+/g, "\\+").replace(/\-/g, "\\-").replace(/\?/g, "\\?").replace(/\*/g, "\\*").replace(/\./g, "\\."); searchSegment = searchSegment.replace(/{/g, "\\{").replace(/}/g, "\\}").replace(/\(/g, "\\(").replace(/\)/g, "\\)").replace(/\[/g, "\\[").replace(/\]/g, "\\]"); searchSegment = searchSegment.replace(/\$/g, "\\$").replace(/\^/g, "\\^").replace(/\//g, "\/").replace(/\|/g, "\\|");

    KaiWn
    KaiWn的最后回复，
  12. KaiWn

    混淆工具javascript-obfuscator

    由 KaiWn
    • 0 篇回复
    • 168 次查看

    npm install javascript-obfuscator -g javascript-obfuscator config.js --config HunxiaoConfig.json --output config1.js HunxiaoConfig.json { "compact": true, "controlFlowFlattening": true, "controlFlowFlatteningThreshold": 1, "deadCodeInjection": true, "deadCodeInjectionThreshold": 1, "disableConsoleOutput": true, "identifierNamesGenerator": "hexadecimal", "log": false, "renameGlobals": false, "rotateStringArray": true, "selfDefending": true, "stringArray": true, "stringArrayEncoding": ["base64"], "stringArrayThreshold": 1, "unicodeEscapeSequence": false }

    KaiWn
    KaiWn的最后回复，
  13. KaiWn

    web和vue-cli

    由 KaiWn
    • 0 篇回复
    • 154 次查看

    1、什么是Webpack WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用。 2、为什要使用WebPack 打包：减少了http请求数量，让页面加载和显示更快在开发后完成的这个合并的过程就是打包。webpack在打包过程中，会分析各个文件之间的依赖关系，然后生成一个依赖图并用文件的形式保存下来，未来浏览器运行代码的时候就可以读取这个文件，就知道了各个代码块之间的关联以及如何调用了。 打包是webpack最核心的功能，webpack其它所有的功能都是为了让打包这个功能更好。我们从一个简单的html页面介绍了通过webpack对模块进行打包，既保留了单个模块的可维护性，又减少了页面的http请求，减少了页面加载时间，从而增加了页面的显示速度，让整个应用的体验更好。 另外如今的很多网页其实可以看做是功能丰富的应用，它们拥有着复杂的JavaScript代码和一大堆依赖包。为了简化开发的复杂度，前端社区涌现出了很多好的实践方法 a:模…

    KaiWn
    KaiWn的最后回复，
  14. KaiWn

    JavaScript

    由 KaiWn
    • 0 篇回复
    • 168 次查看

    一、js简介 js与java没有关系 js也是一门编程语言 它也是可以写后端代码的 nodejs 支持js代码跑在后端服务器上 JavaScript 是脚本语言 JavaScript 是一种轻量级的编程语言。 JavaScript 是可插入 HTML 页面的编程代码。 JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。 // 单行注释 /* 多行注释1 多行注释2 多行注释3 */ //两种引入方式 /* 1.script标签内部直接书写js代码 2.script标签src属性引入外部js代码 */ 二、变量与常量 变量： 在js中，首次定义一个变量名的时候需要用关键字来声明 关键字：var，es6推出的新语法let var在for循环里面定义也会影响到全局 let在局部定义只会在局部生效 变量命名规范 1.由字母，数字，下划线…

    KaiWn
    KaiWn的最后回复，
  15. KaiWn

    JavaScript 异步函数的 Promisification 处理

    由 KaiWn
    • 0 篇回复
    • 165 次查看

    Promisification 是一个很长的词，表示一个编程范式的转变，即将接受回调的函数转换为一个返回类型为 Promise 的函数。 我们现实的开发项目中经常需要这种转换，因为许多函数和库都是基于回调的，但是 Promise 更方便，所以对它们进行 Promisification 处理是有意义的。 下面是一个简单的例子。 function loadScript(src, callback) { let script = document.createElement('script'); script.src = src; script.onload = () => callback(null, script); script.onerror = () => callback(new Error(`Script load error for ${src}`)); document.head.append(script); } 这段代码，动态创建一个 script 元素，待其加载完毕后，会触发 onl oad 事件指定的回调函数。 运行时，loadScript 的调用者，负责指定回调函数： loadScript('path/script.js', (err, script) =&…

    KaiWn
    KaiWn的最后回复，
  16. KaiWn

    JavaScript之面向对象

    由 KaiWn
    • 0 篇回复
    • 156 次查看

    面向对象 概述 面向对象是一种编程思想（oop），他是将对应的过程替换成对应的对象，而不做去追求对应的过程实现，而通过去找对象的方式实现。综合思想：找有这个功能的对象，做这个事情。（面向对象同时具备一个点 万物皆对象（所有的内容都可以被充当为对象）） 示例 按照我们之前的写法，对应的编程思维被称为面向过程。面向就是着重点在于过程。比如去吃面这个事情。 需要找面馆 需要找服务员下单 等厨房做完 等服务员端上来 拿双筷子准备吃 行为是在过程中产生的，这种思想被称为面向过程编程。 …

    KaiWn
    KaiWn的最后回复，
  17. KaiWn

    JavaScript中的es5及es6新增的内容

    由 KaiWn
    • 0 篇回复
    • 153 次查看

    ES5及ES6 es表示ECMASCript ，他是从es3，es5，es6，es5是2009.12月发布的，es6是2015.6月发布的。vue2完全支持es5的（vue3完全支持es6的），react完全支持es6 es5的新特性 严格模式（对应的相反的称为怪异模式） 'use strict' //一般用于相关的设计 上面书写一个严格模式底下的代码就需要按照严格模式执行 严格模式的特性 变量必须要带修饰符 "use strict"; a = 10 console.log(a); //a is not defined 函数里面this不能指向window function sayHello(){ console.log(this); //undefined } sayHello() 不允许在非函数的代码块内声明函数 禁止八进制方法 函数的arguments数组形参和实参不同步 对于数组和字符串都进行了加强…

    KaiWn
    KaiWn的最后回复，
  18. KaiWn

    JavaScript ES6新增

    由 KaiWn
    • 0 篇回复
    • 156 次查看

    命名修饰符 let：不能重复声明变量、块级作用域 let a = 1; let a = 2; //报错 const：初始化常量，必须给初始值，否则报错、在同一个作用域内，const定义的常量不能修改其值、块级作用域 const a = 10 a = 100 //报错，不能重复声明 解构 const obj = { name:'jack' age:18 sex:'男' } let{name,age,sex} = obj 箭头函数 let i = (a) =>{ console.log(a*2) } i(2)//4 let j = (b) => console.log(b+3) j(2)//5 扩展运算符 var arr = [1,2,3] var arr1 = [4,5,6] var arr2 = arr.concat(...arr1) //输出arr2为[1,2,3,4,5,6] //扩展运算符（...）会将数组或者对象打开，直接打印的话中间的逗号会省略，但是需要用逗号时会自动加上之间的逗号 字符串新增 var str = 'abc' console.log(str.includes('a'))//true //includes 是否包含，包含返回true否…

    KaiWn
    KaiWn的最后回复，
  19. KaiWn

    javascript中的this分析

    由 KaiWn
    • 0 篇回复
    • 136 次查看

    函数中的this 在标准函数中，this引用的是把函数当成方法调用的上下文对象，这时候通常称其为this值（在网页的全局上下文中调用函数时，this指向window）。 这个this值到底引用哪个对象，必须到函数被调用的时候才能确定，因此这个值在代码执行过程中可能会变。 箭头函数中的this 在箭头函数中，this引用的是定义箭头函数的上下文。也可以说this值取决于该函数外部非箭头函数的this值，且不能通过call(), apply(), bind() 方法来改变this值。 类中的this 类的声明基本上还是基于自定义类型声明的语法糖 class Person { constructor(name) { this.name = name; } getName() { return this.name } } typeof Person // function 等价于 function Person(name) { this.name = name } Person.prototype.getName = function() { return this.name } class中的…

    KaiWn
    KaiWn的最后回复，
  20. KaiWn

    使用 JavaScript Promise 读取 Github 某用户的数据

    由 KaiWn
    • 0 篇回复
    • 134 次查看

    代码如下： // Make a request for user.json fetch('/article/promise-chaining/user.json') // Load it as json .then(response => response.json()) // Make a request to GitHub .then(user => fetch(`https://api.github.com/users/${user.name}`)) // Load the response as json .then(response => response.json()) // Show the avatar image (githubUser.avatar_url) for 3 seconds (maybe animate it) .then(githubUser => { let img = document.createElement('img'); img.src = githubUser.avatar_url; img.className = "promise-avatar-example"; document.body.append(img); setTimeout(() => img.remove(), 3000); // (*) }); 这里的语义比较清楚，每一个…

    KaiWn
    KaiWn的最后回复，

黑客攻防讨论组

黑客攻防讨论组

  
    You don't have permission to chat.

    黑客世界站内导航 (SITE MAP)

    ×
    ×
    • 创建新的...