Javascript基础
文章平均质量分 62
js的基础知识
@皮皮榴
一个前端开发的小菜鸟,分享一些小知识,一起进步~
展开
-
跨域解决方案-JSONP
在出现之前,开发者们用一种奇妙的办法来实现跨域–JSONP。要实现JSONP,需要浏览器和服务器来一个“完美”配合。但是,JSONP有着明显的缺点,即其只能支持GET请求。原创 2024-04-27 14:33:42 · 377 阅读 · 0 评论 -
JavaScript中操作DOM相关的尺寸和位置
在JavaScript中操作DOM节点使其运动的时候,常常会涉及到各种宽高以及位置坐标等概念。本章,我们就一起来总结一下使用JavaScript操作DOM时,尺寸和宽高相关的属性。原创 2024-04-24 18:02:22 · 1063 阅读 · 0 评论 -
javaScript中的严格模式
严格模式是从ES5开始新增的一种方式,是采用具有限制性JavaScript变体的一种方式,从而使代码隐式地脱离“马虎模式/稀松模式/懒散模式“(sloppy)模式。JavascriptJavascript“严格模式”体现了Javascript更合理、更安全、更严谨的发展方向,支持严格模式的浏览器有:。在“严格模式下”,同样的代码,可能会有不一样的运行结果。一些在“正常模式”下可以运行的语句,在“严格模式”下将不能运行。原创 2024-04-24 14:46:03 · 771 阅读 · 0 评论 -
javaScript中阻止事件默认行为的那些事儿~
所谓默认行为,一般是指HTML元素所自带的行为。例如点击一个a元素表示的是跳转:原创 2024-04-24 10:58:46 · 873 阅读 · 0 评论 -
ES6箭头函数与this、简单分析this指向问题及解决方式
输出结果:普通函数中,this指向调用者,this即person对象输出结果:说明箭头函数中的this没有找到name属性箭头函数在哪定义的,函数中的this就指向所在作用域中的this,即箭头函数外的this输出结果:因为中的最终会被放到全局执行上下文中执行,此时的this指向window解决方式2使用箭头函数中的function函数体中的this指向的是上层函数体中的this,即中的this,而这里的this取决于谁调用了它,person调用了,那么相当于理解JS原创 2021-07-31 18:50:13 · 347 阅读 · 0 评论 -
javaScript中的this 指向
this关键字是一个非常重要的语法点。this可以用在构造函数之中,表示实例对象。除此之外,this还可以用在别的场合。this。关于this的指向,有一种广为流传的说法就是“谁调用它,this就指向谁”。这样的说法没有太大的问题,但是并不全面。总结起来,this的指向规律有如下几条:在函数体中,非显式或隐式地简单调用函数时,在严格模式下,函数内的this会被绑定到undefined上,在非严格模式下则会被绑定到全局对象上。原创 2024-04-23 15:27:34 · 621 阅读 · 1 评论 -
javaScript异步编程--浏览器事件循环机制
实现JavaScript 事件循环机制以运行时环境划分,可分为浏览器、Node.js及Deno事件循环机制,三者的实现技术不一样:浏览器 Event Loop 是 HTML 中定义的规范;Node.js Event Loop 是由 libuv 库实现;Deno Event Loop 是 由 Rust 语言的 Tokio 库实现。这里只讲浏览器部分。进程、线程进程是系统分配的独立资源,是 CPU 资源分配的基本单位,进程是由一个或者多个线程组成的。线程是进程的执行流,是CPU调度和分派的基转载 2022-04-22 08:53:14 · 165 阅读 · 0 评论 -
javaScript异步编程解决方案的变迁
转载 2022-04-20 22:13:27 · 70 阅读 · 0 评论 -
javaScript对象的内部特性
对象理解对象对象可以定义为一组属性的无序集合。严格来说,这意味着对象就是一组没有特定顺序的值。对象的每个属性或方法都由一个名称来标识,这个名称映射到一个值。可以把对象想象成一张散列表,其中的内容就是一组名/值对,值可以是数据或者函数。属性的类型对象中会有一些内部特性来描述属性的特征。这些特性是由为 JavaScript 实现引擎的规范定义的,开发者不能在 JavaScript 中直接访问这些特性。为了将某个特性标识为内部特性,规范会用两个中括号把特性的名称括起来,比如[[Enumerable]]。原创 2021-12-05 17:19:17 · 957 阅读 · 1 评论 -
JavaScript命名规范
对于js命名应遵循 简洁、语义化 的原则转载 2021-11-09 11:19:38 · 3188 阅读 · 0 评论 -
JS中的Date对象、获取日期、日期的计算
获取一个日期对象 日期的构造函数var d = new Date();如果Date()没有参数 得到的是当前日期 获取的日期格式:中国标准时间格式如果Date()有参数:接收一个日期格式的字符串,则以该日期为准var d = new Date("1990-10-11 06:8:8"); <=> var d = new Date("1990/10/11 06:8:8");var d = new Date(1990); //1970...不识别一个参数如果Date()有原创 2021-08-01 20:43:11 · 1159 阅读 · 0 评论 -
JS对象标识及相等判定(检查超过两个值是否相等)
ES6—Object.is(JS中的两等、三等比较)小知识console.log(0 == false); // trueconsole.log(0 === false); // fasleconsole.log(+0 === -0); // trueconsole.log(NaN === NaN); // fasle// ES6中的比较console.log(Object.is(+0, -0)); // falseconsole.log(Object.is(NaN, NaN)); // tr原创 2021-08-01 11:49:04 · 343 阅读 · 0 评论 -
ES6对象字面量增强小知识(给对象添加随机的属性名)
ES6对象字面量增强小知识ES6之前对象属性赋值const bar = '345';const obj = { foo: 123, bar: bar // 给bar属性赋值}ES6简化const bar = '345';const obj = { foo: 123, bar // ES6赋值}ES6对象属性函数写法const bar = '345';const obj = { foo: 123, bar, meth原创 2021-08-01 11:23:56 · 119 阅读 · 0 评论 -
js中的this到底指向谁?
作用域:全局作用域每个JS文件就是一个全局的作用域,它有且只有一个局部作用域每个独立的函数就是:局部作用域,平级的局部作用域不可相互访问词法作用域在函数内部可以访问的上级的作用域就是:词法作用域闭包:闭包是有权访问另一个函数作用域中变量的函数,举个栗子function robot() { var name = '小仙女' return function() { console.log(`我是${name},喵 ~`)}}var kitty = robot()注转载 2021-07-31 18:20:18 · 277 阅读 · 0 评论 -
ES6字符串扩展方法(startsWith、endsWith、includes)
ES6字符串扩展方法startsWith:判断字符串开头是否包含某个字符endsWith:判断字符串结尾是否包含某个字符includes:判断字符串中是否包含某个字符const message = 'Error: foo is not defined';console.log(message.startsWith('Error')); // trueconsole.log(message.endsWith('defined')); // trueconsole.log(message.in原创 2021-07-31 17:28:10 · 201 阅读 · 0 评论 -
ES6对象的解构小知识
ES6对象的解构小知识用对象中的键名做匹配,name是键名,提取的是name对应的值其他特性与数组解构相同,即没有匹配上的属性为undefined,属性可赋默认值注意,解构的变量名同时也是用来匹配被解构对象中属性名的,所以当当前作用域当中有同名的变量名时就会产生冲突使用重命名的方式去解决上面的问题重命名 + 设置默认值实际应用场景对象解构的实际应用场景就很多了,比如调用接口返回数据之后拿响应的状态、data等,一般返回体数据对象写为reslet { status, data, m原创 2021-07-31 13:18:53 · 114 阅读 · 0 评论 -
ES6数组的解构赋值小知识
ES6数组的解构赋值小知识按顺序对应位置依次赋值只赋值数组中的某一个成员的值对应位置保留(占位)用逗号隔开,这样就能提取到指定位置的成员rest(…语法),第一个成员之后所有成员放到一个数组中如果解构成员的成员个数小于被解构数组长度,按照从前到后顺序去提取如果解构成员的成员个数大于被解构数组长度,则超出的解构成员undefined,相当于数组索引越界(访问一个不存在的数组下标)给提取的成员设置默认值,如果解构(提取)不到则会用默认值,就不会出现undefined的情况举个栗子原创 2021-07-31 12:59:23 · 181 阅读 · 0 评论 -
手写loader参考
前置手写loader分为上下(手写打包器)我们可以认为手写loader就是手写打包器webpack打包流程(手写简易的打包器->js模块的打包工作)在整个工作流中有一个环节(loader来实现不同类型的文件都按模块处理)手写loader上(配置 使用 语法 常见的loader手写)手写loader下(将loader和打包器结合起来)plugin(插件)tapable插件实现,执行时机,自定义插件自己实现一个打包流程 + 自己写的loader + 自己写的插件 =&g原创 2021-07-31 12:06:18 · 597 阅读 · 0 评论 -
for循环小知识(for循环其实有两层嵌套作用域)
for循环执行for循环拆解,相当于下面代码,每次循环都有if判断的代码块原创 2021-07-31 11:51:55 · 590 阅读 · 0 评论 -
完善一个防抖函数
/ 因为只要 timer 为 null 就意味着没有第二次、第三次、...第N次的点击。// 如果我们想要执行最后一次,那就意味着无论我们当前点击多少次,前面的N-1次都无用。// 如果想要实现只在第一次执行,那么可以添加上 timer 为 null 作为判断。// 所谓的防抖效果我们想要实现的就是有一个“人”可以管理handle的执行次数。// 所以为了保证每个下一次的点击拿到的timer都是初始的值null。// 当前我们执行了按钮点击之后就会执行 ...返回的proxy。// 定义事件执行函数。原创 2021-07-28 21:27:30 · 222 阅读 · 0 评论 -
实现一个防抖函数
immediate 控制执行第一次还是最后一次,false表示只执行最后一次。// 如果我们想要执行最后一次,那就意味着无论我们当前点击多少次,前面的N-1次都无用。// 所谓的防抖效果我们想要实现的就是有一个“人”可以管理handle的执行次数。// 当前我们执行了按钮点击之后就会执行 ...返回的proxy。* handle 最终需要执行的事件监听。* wait 事件触发之后多久开始执行。// 参数类型判断及默认值处理。// 定义事件执行函数。原创 2021-07-27 21:29:33 · 268 阅读 · 0 评论 -
Axios请求配置
Axios请求配置这些是创建请求时可以用的配置选项。只有 url 是必需的。如果没有指定 method,请求将默认使用 get 方法。{ // `url` 是用于请求的服务器 URL url: '/user', // `method` 是创建请求时使用的方法 method: 'get', // 默认是 get // `baseURL` 将自动加在 `url` 前面,除非 `url` 是一个绝对 URL。 // 它可以通过设置一个 `baseURL` 便于为 axios 实例的原创 2021-07-21 21:01:14 · 675 阅读 · 0 评论 -
解决axios请求处理拦截器里回调函数的异步执行
axios请求处理拦截器里回调函数的异步执行,导致获取token刷新失败的方法// 添加请求拦截器https.interceptors.request.use(config => { if (判断token是否过期) { let promisefresh = new Promise(function (resolve, reject) { //刷新token的方法 WebViewJavascriptBridge.callHan转载 2021-07-21 20:54:45 · 1721 阅读 · 0 评论 -
深入学习Axios源码(构建配置)
前言axios是我们日常代码中常用的一个http库,它可以用来在浏览器或者node.js中发起http请求;它强大的功能和简单易用的API受到了广大前端童鞋们的青睐;那么它内部是如何来实现的呢,让我们走进它的源码世界一探究竟。axios特性从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRFaxios大致处理流程Axios多种转载 2021-07-20 21:30:14 · 278 阅读 · 0 评论 -
深度理解Axios
Axios使用手册转载 2021-07-20 20:35:39 · 103 阅读 · 0 评论 -
Performance工具?内存管理?浏览器任务管理器
Performance为什么使用Performance通过Performance时刻监控内存Performance使用步骤Edge浏览器模拟Performance使用内存问题的外在表现界定内存问题的标准内存膨胀:当前应用程序本身(比如当前界面)为了达到最优的效果,会需要很大的内存空间,所以它会去申请这个需要的空间,但是这个空间的大小远超过了设备本身所能提供的大小,这个时候就会感受到持续性的糟糕的性能体验。所以内存膨胀也许是因为当前设备硬件不支持,需要在多台(用户常用的)设备上去进行原创 2021-07-19 20:49:23 · 626 阅读 · 0 评论 -
简单了解javaScript中的构造函数constructor、prototype属性、__proto__
实例方法、属性: 只能实例调用原型方法: 实例、prototype都可调用静态方法: 只能类调用类的原型属性: 只能类调用constructor为类的默认方法,通过new的调用可以执行这个方法,给实例属性赋值每个类都必须要有这个方法,如果没有显示定义,则默认一个空的constructor被添加到类里面。constructor方法默认返回实例对象。原创 2021-07-13 21:04:51 · 108 阅读 · 0 评论 -
JS(简单的动态菜单)
如何实现自定义菜单呢~<style>.two { margin-left: 30px;}.three { margin-left: 60px;}</style><div id="box"> </div><script>let arr = [ {id:1, name: '零食', pid: 0, level: 1}, {id:2, name: '生活用品', pid: 0, level原创 2020-06-16 20:27:01 · 839 阅读 · 0 评论