js基础
关注
分享
扫一扫
js基础
pg_li
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
exceljs defaultRowHeight 只在可视范围内生效
exceljs defaultRowHeight 只在可视范围内生效。原创 2023-03-02 10:17:58 · 228 阅读 · 0 评论 -
微服务乾坤使用
1、安装乾坤npm i qiankun -S2、修改主应用主应用分为路由形式加载和手动加载俩种形式路由形式加载，在启动文件中增加启动代码，适合基于大面积替换子应用的场景，例如切换首页应用直接替换当前应用。registerMicroApps([ { name: 'stream-media', // app name registered entry: '//localhost:9001', // 加载应用地址 container: '...原创 2021-05-24 20:16:06 · 3166 阅读 · 2 评论 -
javaScript number类型细节记录
1、四舍五入toFixed:银行家舍入例子：Math.round，*10取整 再除102、精度问题原创 2021-04-15 08:27:38 · 166 阅读 · 0 评论 -
js编译原理学习
一、编译原理词法分析将字符串分解成代码块（也叫词法单元）例如：var a = 2;被解析为var、a、=、2 、;。语法分析将词法单元流转换成抽象语法树（由元素逐级嵌套所组成的代表了程序语法 结构的树）{ "type": "Program", "body": [ { "type": "VariableDeclaration", //变量声明 "declarations": [ { "type": "Vari..原创 2020-12-09 14:54:25 · 1639 阅读 · 0 评论 -
javaScript匿名函数、具名函数、IIFE
匿名函数：（function(){}）一般会是IIFE使用，达到隔离作用域的目的但是有一定的缺陷1、调试追踪困难、可读性可维护性差2、如果需要引用自身，只能使用过期的arguments.callee【用于引用该函数的函数体内当前正在执行的函数，已从ES5严格模式中删除】引用且在事件监听处理中需要解除绑定具名函数：function test() {} 推荐使用IIFE:立即执行函数：function(){})();为了生成块级作用域，let关键值支持之前，只有全局作用域和函数作..原创 2020-07-16 21:11:37 · 382 阅读 · 0 评论 -
可视化范围加载复习
1、定义监听函数，监听onscroll事件2、提前占位，并且能获取每个模块的高度3、判断是否在可视范围内，如果在，则加载<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> ...原创 2019-12-11 17:57:18 · 233 阅读 · 0 评论 -
Generator函数的理解和使用
版权声明：本文为博主原创文章，转载请注明出处。 https://blog.youkuaiyun.com/ganyingxie123456/article/details/78152770Generator函数的理解和使用Generator 函数是 ES6 提供的一种异步编程解决方案。一、异步编程1、所谓“异步”，简单说就是一个任务分成两段，先执行第一段，然后转而执行其他任务，等做好了准备，再...转载 2018-10-31 14:53:23 · 798 阅读 · 0 评论 -
Http failure response for (unknown url): 401 From Simple Intercept
1、问题现象及背景和后台配合做一个验证码功能，前端直接以一个get请求获取验证码数据。报该错误Http failure response for (unknown url): 401 From Simple Intercept -->http://ng-alain.com/docs/auth"name2、原因前后台没有对齐，后台返回的直接是一个图片，不是数据。...原创 2019-04-04 16:57:54 · 6949 阅读 · 0 评论 -
js获取数组最大值（Math.max.apply(null, arr)）
/** * 获取数组的最大值 * @param {Array<number>} arr 数组类型 且元素为number * @returns {any} */ getMax(arr: Array<number>) { // 利用apply 将数组元素拆成一个个参数让Math.max去计算 // ES5写法Math.max....原创 2018-10-16 17:11:42 · 3164 阅读 · 0 评论 -
js字符串格式化方法format
/** * 设置字符串format函数 * 例子: '{0}{1}.format(5,6)' */setStringFormat() { String.prototype['format'] = function () { const e = arguments; return !!this && this.replace(/\{(\d+)\}/g, ...原创 2018-10-12 17:44:21 · 27735 阅读 · 0 评论 -
js判断浏览器
//出自ext.js 增加ie11和edge判断var App = {};(function () { var check = function (regex) { return regex.test(navigator.userAgent.toLowerCase()); }; App.isStrict = document.compatMode == "CSS1C...原创 2018-08-23 16:56:20 · 274 阅读 · 0 评论 -
offsetX ， clientX ，pageX ，screenX ，layerX ， x ，screen
event属性layerX —— 相比较于当前坐标系的位置,即如果触发元素没有设置绝对定位或相对定位,以页面为参考点,如果有,将以当前触发元素坐标框border为起点offsetX —— 返回相对于当前触发元素内容（不含border）位置的水平坐标，有border的话可能出现负值。clientX —— 返回当事件被触发时鼠标指针向对于浏览器页面（或客户区）的水平坐标。pa...原创 2018-08-15 16:52:10 · 323 阅读 · 0 评论 -
ng-alain通过修改样式实现菜单布局切换
这种样式修改的方式限制太多，且比较麻烦，因此又通过对sidebar-nav进行修改，来实现该功能。第二版。一、页面效果1、默认的左右布局2、切换后的上下布局二、代码实现1、布局切换服务类，用于通知需要改变布局的模块去改变样式import { Injectable } from '@angular/core';import { Subject } fro...原创 2018-06-20 16:04:25 · 7108 阅读 · 1 评论 -
Symbol理解
主要用于给对象添加属性时防止key值重复，导致的属性覆盖。 const a = Symbol('a'); // 可成Sring和Boolean类型 const b = Symbol('a'); const c = 'b'; const d = 'b'; const obj = { a: 1 }; obj[a] = 1; obj[b] = 1; obj[c] = ...原创 2018-10-31 16:12:34 · 425 阅读 · 0 评论 -
Proxy学习
对象拦截器，可对外界的访问进行过滤和改写。1、拦截方法Handler Method 参数 触发场景 返回值 get (target,propKey,receiver) 1、目标对象。 2、访问属性 3、get函数的this对象（可选） 属性读取 set (target,propKey,receiver) 1、目...原创 2018-10-31 18:00:33 · 284 阅读 · 0 评论 -
js特殊字符转义
/** * 特殊字符转义 防止XSS攻击 用于特殊字符正常显示 * @param text * @constructor */function StringFilter(str) { var s = ""; if (str.length === 0) { return ""; } s = str.replace(/&/g, "&amp;"); ...原创 2018-12-06 14:52:12 · 7456 阅读 · 1 评论 -
js限制浏览器记住账号密码
使用框架为angualr61、输入框关键：autocomplete="off"<input nz-input name="txtUsername" formControlName="username" placeholder="请输入账户" autocomplete="off">2、密码框 type="password" autocompl...原创 2019-03-29 13:34:05 · 2660 阅读 · 0 评论 -
js判断图片是否可从服务器正常取回
场景做OEM定制化功能，在服务端只保存的当前图片的静态路径，但是当重新部署环境时，图片目录会被覆盖，此时基于产品健壮性考虑，在加载OEM定制logo等图片时，先做下判断，看定制数据能否正常取回。解决方案 /** * 验证图片后 进行热更新 * @param {string} url 图片路径 * @param {string} key * @param {b...原创 2019-06-25 18:01:14 · 310 阅读 · 0 评论 -
js实现下载多张图片并压缩起来
1、背景项目中需要把一些业务图片采集起来做一些分析。但是后台工作量太大，分析下前端能不能实现这个功能。2、实现1、jszip.js压缩并保存图片2、FileSaver.js 保存压缩文件/** * 将图片转换成base64 并返回路径 * @param img * @param {number} width 调用时传入具体像素值，控制大小 ,不传则默认图像...原创 2019-06-28 16:53:51 · 4064 阅读 · 1 评论 -
lable语句
在代码中增加标记，以便以后使用。一般和break，continue结合使用。var num = 0;var num2 = 0;var test = 0;test: for(var i =0;i< 5;i++) { if(i < 4) { num2 ++; test++; continue test; } num ++; test++;}cons...原创 2019-09-24 21:34:26 · 138 阅读 · 0 评论 -
Angular中mixins继承
第一种方式/** * @函数名称：copyProperties * @param * @作用：类的属性和函数copy */function copyProperties(target, source) { for (let key of Reflect.ownKeys(source)) { if ( key !== 'constructor' &...原创 2019-10-08 14:13:25 · 1124 阅读 · 0 评论 -
Object.defineProperty
var App = {};Object.defineProperty(App, 'test', { get : function(){//取值时触发 console.log('get'); }, set : function(val){//赋值时触发，val可以是任意类型 console.log('set',val) }, ...原创 2018-04-19 22:04:48 · 133 阅读 · 0 评论 -
谷歌浏览器调用webkitRequestFullScreen方法后，设置的背景色只填充可视范围问题。
1、问题根因 谷歌浏览器下默认对全屏设置的背景色是白色，而当前body是不设置高度的或者设置的是100%，导致背景色只对可视范围生效。2、解决思路 设置谷歌浏览器下，背景色，覆盖掉默认的颜色 //各个浏览器下 全屏状态下背景色设置:-webkit-full-screen { background-color: @content-bg !important;}:-moz-...原创 2018-06-07 10:47:22 · 14379 阅读 · 0 评论 -
javaScript基础事件
javaScript事件（一）事件流一、事件事件是文档或者浏览器窗口中发生的，特定的交互瞬间。事件是用户或浏览器自身执行的某种动作，如click,load和mouseover都是事件的名字。事件是javaScript和DOM之间交互的桥梁。你若触发，我便执行——事件发生，调用它的处理函数执行相应的JavaScript代码给出响应。典型的例子有：页面加载完毕触发load事件；用户单击元素，触发cli...转载 2018-06-08 14:50:04 · 281 阅读 · 0 评论 -
ng-alain封装类似windows ip框查询组件
1、组件样式2、组件代码import { Component, ElementRef, ViewChild, ViewEncapsulation } from '@angular/core';import { NzMessageService } from 'ng-zorro-antd';import { AppUtil } from '@core/util/util.service';@...原创 2018-05-31 18:15:13 · 904 阅读 · 0 评论 -
数组去重
var dedupe = function (arr) { if (Object.prototype.toString.call(arr) === '[object Array]') { /** * Es6 利用解构和Set方法 */ if (Set) { return [...new Set(arr)]; // Array.from(new...原创 2018-04-25 11:44:25 · 201 阅读 · 0 评论 -
原型
Javascript 面向对象编程（一）：封装作者： 阮一峰日期： 2010年5月17日学习Javascript，最难的地方是什么？我觉得，Object（对象）最难。因为Javascript的Object模型很独特，和其他语言都不一样，初学者不容易掌握。下面就是我的学习笔记，希望对大家学习这个部分有所帮助。我主要参考了以下两本书籍：《面向对象的Javascript》（Object-Oriented...转载 2018-04-25 11:21:29 · 251 阅读 · 0 评论 -
Javascript定义类（class）的三种方法
Javascript定义类（class）的三种方法作者：阮一峰在面向对象编程中，类（class）是对象（object）的模板，定义了同一组对象（又称"实例"）共有的属性和方法。Javascript语言不支持"类"，但是可以用一些变通的方法，模拟出"类"。一、构造函数法这是经典方法，也是教科书必教的方法。它用构造函数模拟"类"，在其内部用this关键字指代实例对象。 function Cat() ...转载 2018-04-24 14:43:28 · 392 阅读 · 0 评论 -
js继承和Ext继承
原型链继承var supper = function(name){ this.name = name; this.cfg = ['name']; this.setNmae = (name)=>{ this.name = name; }; this.getNmae = ()=>{ return this.name; };};var ...原创 2018-04-24 10:36:34 · 342 阅读 · 0 评论 -
浅层和深层的属性copy
var App = App || {};(function(){ /** * 判断是否是数组 * @param val * @returns {boolean} */ var toString = Object.prototype.toString; App.isArray = function(val){ retu...原创 2018-04-19 19:43:14 · 322 阅读 · 0 评论 -
js深度clone
var App = App || {};(function(){ /** * 判断是否是数组 * @param val * @returns {boolean} */ var toString = Object.prototype.toString; App.isArray = function(val){ retu...原创 2018-04-19 19:37:55 · 276 阅读 · 0 评论 -
call、apply、bind
/*** 作用：都是在特定的作用域中调用函数时改变this的指向，指向函数的this，非调用者。* 不同点：apply接收的第二个参数必须是数组。call需要没有这个限制，但是参数要一一列举* bind不会立即执行*/var test = {name : 'test'};var testFun = function(name){return name != undefined ...原创 2018-04-19 19:05:47 · 177 阅读 · 0 评论 -
JSON常用方法
/** *JSON.parse 字符串转成对象 * 参数1：字符串 * 参数2：执行函数，有返回值 * @type {string} */var parseTest = function(){ var data = '{"data":[],"parmas":{}}'; return JSON.parse(data,function(key,val){ ...原创 2018-04-19 17:35:55 · 4243 阅读 · 0 评论 -
js原型和原型链的理解
/** * 在js这门语言中，一切都是对象，继承Object Function * 一个对象一旦创建（通过构造函数），就当是造一个盘古出来，开天辟地第一人。 * 盘古一旦出来，天生有神通。有一个prototype的属性神通。 * 这个prototype属性指向盘古的小宇宙（原型对象）， * 也可以理解为prototype就是盘古的原型对象 * 但是呢这个小宇宙只要constuct属性...原创 2018-05-05 00:31:00 · 401 阅读 · 0 评论 -
canvas性能优化
Canvas 最佳实践（性能篇）作者: 叶斋 发表于: 2016-02-22Canvas 想必前端同学们都不陌生，它是 HTML5 新增的「画布」元素，允许我们使用 JavaScript 来绘制图形。目前，所有的主流浏览器都支持 Canvas。Canvas 最常见的用途是渲染动画。渲染动画的基本原理，无非是反复地擦除和重绘。为了动画的流畅，留给我渲染一帧的时间，只有短短的 16ms。在这 16ms...转载 2018-05-05 14:28:24 · 1769 阅读 · 0 评论 -
js实现给dom重复添加事件，不覆盖事件
var addLicenseFnNotOverride = function(dom,event,fn){ //字符串处理，去掉'on' var evString = event.substr(0,2); if(evString == 'on'){ event = event.substr(2); } //浏览器兼容性处理 if(wi...原创 2018-05-05 22:30:36 · 2159 阅读 · 0 评论 -
clientHeight、offsetHeight、scrollHeight、clientWidth、offsetWidth 和 scrollWidth
网页可见区域宽：document.body.clientWidth 网页可见区域高：document.body.clientHeight 网页可见区域宽：document.body.offsetWidth (包括边线的宽) 网页可见区域高：document.body.offsetHeight (包括边线的宽) 网页正文全文宽：document.body.scrollWidth 网页正文全文高：do...转载 2018-06-06 17:40:11 · 862 阅读 · 0 评论 -
关于Web Worker你必须知道的7件事
原文：http://www.developer.com/lang/jscript/7-things-you-need-to-know-about-web-workers.html译者： Rock（ruanqig@gmail.com）转载：https://blog.youkuaiyun.com/shenlei19911210/article/details/49779613介绍通过使用Web Worker， 我...转载 2018-06-13 09:49:32 · 11727 阅读 · 0 评论 -
Angular4首页加载慢优化之路
Angular是一个比较完善的前端MVC框架，包含了模板，数据双向绑定，路由，服务，过滤器，依赖注入等等所有的功能。在Web开发前后端流行的今天，我们在某个项目中也尝试使用该框架。 很快按照官网上的例子搭建了一个标准工程，在项目初期工程文件不是很多的时候，编译、打包、然后运行，访问项目的各个页面都很快。和传统的模板引擎相比这种前后端分离不仅工程化更加成熟（前端、后端开发人员专注自己的领域），而且各...转载 2018-06-06 09:36:48 · 3350 阅读 · 0 评论 -
ES6常用对象操作整理
const简单类型数据常量// const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。 const PI = 3.1415926; console.log(PI) 对象常量const foo = Object.freeze({});// 常规模式时，下面一行不起作用；...转载 2018-05-30 11:38:01 · 964 阅读 · 1 评论