![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
文章平均质量分 67
js
小小程序员——Tracy
你说 程序员是青春饭吗?
展开
-
对象的深拷贝和浅拷贝
1.浅拷贝es6 新增方法 Object.assign const info = {name: "why", age: 18, friend: {name: "kobe"}}; const obj = Object.assign({}, info); info.name = "kobe"; console.log(obj.name); info.friend.name = "james"; console.log(obj.friend.name);2.深拷贝原创 2022-04-24 19:22:38 · 932 阅读 · 0 评论 -
防抖函数 debounce 节流函数 throttle
对于一些操作非常频繁的函数,我们要进行防抖操作,比如说我们用 Better score 的时候,为了解决滚动区域不准确的问题,需要在每个图片加载完成之后调用this.$refs.scroll.refresh();但是我们其实在最后一个图片加载完成之后调用一次就可以了。 由于我们无法判断哪个图片是最后一个加载完成的,因此每个图片加载完成后先调用防抖函数,在某个时间之内如果另外的图片也加载完成了,那么就取消前一个图片load 完想要调用还没有调用的 refresh 操作。直到最后一个图片调用防抖函数..原创 2021-09-26 16:07:32 · 178 阅读 · 0 评论 -
得到字符串占多少 KB
getStringSize(text){lettextlength=Buffer.byteLength(text,'utf8');//得到占多少bytesletsize=textlength/1024;//得到字符串占多少KBreturnsize.toFixed(2);},原创 2021-09-09 13:21:33 · 1914 阅读 · 0 评论 -
Tracy JS 小笔记 - 预编译,闭包
预编译它就是用来解决执行顺序的 JS 执行三部曲: 语法分析;预编译;解释执行 语法分析: 通篇扫描看看有没有语法错误 预编译 规则: imply global 暗示全局变量: 任何变量,如果未经声明就赋值,此变量就为全局对象所有。 Demo: var a = b = 123; 先把 123 赋值给b, 然后声明一个 a 再把 b 的值付给 a; b 变量还没有声明, 所以 b 是暗示全局变量, 现在 window.b 就可以用了 window 就是全局: 一切的全局变量,全是 windo原创 2021-06-02 16:33:37 · 106 阅读 · 0 评论 -
Tracy JS 小笔记 - 对象,包装类,原型,原型链
对象引用值 var obj = { Name : "Tracy", Age : "18", Key : "Value",health: 100, smoke: function(){this.health--;} } 注意,对象里的 smoke 方法,想要改变 health 值,也不能直接写 health, 而是要写 this.health 或者是 obj.health; 对象的方法 obj.smoke(); 对象的属性有两种调用方法:obj.Name; obj['Name'];...原创 2021-06-02 16:30:23 · 88 阅读 · 0 评论 -
Tracy JS 小笔记 - Dom 操作
DOM = Document Object ModelDom 是一个方法,提供了 JS 可以操作 html 和 xml 的方法. DOM 不能操作 CSS. 我们不能在一个 .css 文件里删除某个 class 或者添加东西。 我们看起来的改了某元素的 css 其实是改了 html 元素的行内样式。 学 DOM 开始 一切系统给我们生成的成组的方式 比如 "getElementsByClassName("");",基本都是类数组是不能写 push 方法的DOM 继承树就是一系列继承关系N原创 2021-06-02 16:29:34 · 118 阅读 · 0 评论 -
Tracy JS 小笔记 - Call/apply,This, 继承模式,命名空间,对象枚举
call/apply: 改变 this 指向call 和 apply 的作用是 改变 this 指向 区别就是传参列表不同 Call 的两种用法: 任何一个方法都可以 .call() 执行函数 function test(){} test();//执行函数 test.call();//执行函数的本来面目,和上面 test(); 是一模一样的 改变函数里 this 指向 function Person(name, age){ this.name = name原创 2021-06-02 16:27:38 · 125 阅读 · 0 评论 -
Tracy JS 小笔记 - 克隆, Try/catch, es5
克隆克隆一个和自己一模一样的对象,但是是两个独立的人,互相不干扰 //克隆 值是原始值的,直接克隆即可var obj = { name : 'tracy', age : 31}function clone(origin, target){ var target = target || {}; for(var prop in origin){ if(origin.hasOwnProperty(prop)){ targ原创 2021-06-02 16:26:32 · 79 阅读 · 0 评论 -
Tracy JS 小笔记 - 日期对象,定时器
日期对象getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6: 0 代表礼拜天,其他正常) getMonth() 从 Date 对象返回月份 (0 ~ 11)。 这个值 + 1 之后才是我们正常的月份 getTime()最常用,最有用的。 返回 1970 年 1 月 1 日至今的毫秒数,计算机的纪元时间。 它可以用来记录"时间戳",比如查看一个循环执行了多长时间 var firstime = new Date().getTime(); for(var i = 0; i <.原创 2021-06-02 16:22:55 · 11254 阅读 · 0 评论 -
Tracy JS 小笔记 - JS 库收藏/ 脚本化 CSS
滚动条滚动距离window.pageXOffset/ window.pageYOffset 求滚动条滚动的像素 IE8 以及 IE8 以下不兼容 document.body.scrollLeft/document.body.scrollTop document.documentElement.scrollLeft/document.documentElement.scrollTop IE8 和 IE8 以下 兼容性混乱,一组好用,另外一组的值一定为零 因此兼容所有 IE8 和 IE8 以下浏览原创 2021-06-01 10:42:11 · 60 阅读 · 0 评论 -
Tracy JS 小笔记 - 事件
事件绑定交互体验的核心功能 dom.on### = function(){} 这种绑定兼容性特别好 this 指向 dom 元素自己 缺点:一个事件只能绑定一个函数,写两个的话 后一个会覆盖前一个 mydiv.onclick = function(){console.log("a");} mydiv.onclick = function(){console.log("b");} 只能输出 b, 因为它本质上还是属性赋值 基本等同于写在元素行间上 <div oncli原创 2021-06-01 10:41:13 · 166 阅读 · 0 评论 -
Tracy JS 小笔记 - json, 异步加载, 时间线
json它是一个对象,是为了数据传输,为了前后端的通讯 属性名强制加双引号 { "name": "Tracy", "age" : 18 } JSON 是一个静态类,相当于 Match, 有各种方法可以使用 前端传 json 给后端 var obj = { "name" : "Tracy", "age" : 18};JSON.stringfy(obj);//把对象转换成 字符串的 json 格式,传输给后台 后端传 json 给前端 var str = JSON.stringf.原创 2021-06-01 10:39:11 · 103 阅读 · 0 评论 -
Tracy JS 小笔记 - 数据结构 栈,队列,链表,字典,集合,哈希表(散列表)
数据结构栈后进先出(兜儿),栈应该有如下方法: 入栈 push() 添加栈顶元素 出栈 pop() 移除栈顶元素 获取栈顶元素 peek() 是否为空 isEmpty() 清空栈 clear() 栈元素个数 size() js 实现栈结构 -- 封装数组var Stack = function(){ var items = []; //这个变量需要是一个私有的,外部看不到的,这样才是一个栈,不要写成 this.item = []; 否则容易被别人串改原创 2021-06-01 10:35:58 · 141 阅读 · 0 评论 -
Tracy JS 小笔记 - 数据结构 树
树二叉搜索树特点 每个父节点有两个子节点 在左侧存储比父节点小的值 在右侧存储比父节点大的值 优点 : 搜索速度快,效率高 var Tree = function() { var Node = function(value) { this.value = value; this.left = null; this.right = null; } var root = null; //根节点原创 2021-06-01 10:24:46 · 68 阅读 · 0 评论 -
Tracy JS 小笔记 - ES6
ES6let const var的区别let 块级作用域 代替 var, 它是更完美的 var. var 可以看成是 js 语言设计的缺陷。 定义变量不存在变量提升,所以变量必须先定义再使用,否则会报错 不能重复定义。 let a =1; let a=2 如下情况是可以的: let bh=1; { let bh=2; conaole.log(bh) //2 } 上面虽然重复,但是没有再一个块级作用域。块级作用域主要就是看{}。{}就是一块的标志。原创 2021-06-01 10:09:30 · 102 阅读 · 0 评论 -
Tracy JS 小笔记 - 函数(作用域),参数,递归
函数耦合: 重复的功能,冗余的功能,不能一次一次的写,所以我们要写一个函数,来让程序 低耦合 定义函数函数就是另一种形式的变量,它是一个引用值 函数声明: function test() {} 命名函数表达式 var test = function test(){}匿名函数表达式: 非常常用, 也叫作函数表达式 var test = function() {} 特例: var test function abc(){} 调用也是 test(); 不能用 abc(); 和 document.wr.原创 2021-06-01 10:07:57 · 125 阅读 · 0 评论 -
Tracy JS 小笔记 - 运算符,条件语句,循环
运算符+数学运算和字符串连接, 任何数据加上字符串都等于字符串。 var a = 1 + 1 + "a" + 1 + 2; (a="2a12") var a = 1 + 1 + "a" + (1 + 2); (a="2a3") var a = "aa" + true; (a= "aatrue") +; -; *; /; %; = ; () var a = 1 / 0; (a = NaN) NaN(Not a Number)代表非数,但是它是一个数字类型的值; 凡是JS 觉得结果应该是一个数.原创 2021-06-01 10:01:50 · 121 阅读 · 0 评论 -
Tracy JS 小笔记 - 数据类型, typeof,类型转换
数据类型: 原始值,引用值原始值 : 不可改变的原始值,是存储在栈里面 stack, 是个有底儿的箱子结构先进后出。原始值 分为五大类 Number, Boolean, String, undefined, null var a = 1; 我们数据的类型天生就是浮点型,不是整形。 var a = "aa"; var a = 'aa'; var a = undefined; 它是一个类型; 这段话等于 var a; 表示一个变量只声明没有赋值。 var a = none; 表示站位,a 有值,原创 2021-06-01 09:59:56 · 528 阅读 · 0 评论 -
Tracy JS 小笔记 - 浏览器,JS 特性, JS 引入,变量
浏览器 - 主流浏览器: 拥有独立内壳的IE : 内壳是 Trident Chrome : Blink(Webkit的分支) Firefox : Gecko Opera : Blink (Opera内核原为:Presto,现为:Blink;) Safari : WebkitCookie是小甜饼的意思。顾名思义,cookie 确实非常小,它的大小限制为4KB左右,是网景公司的前雇员 Lou Montulli 在1993年3月的发明。它的主要用途有保存登录信息,比如你登录某个网站市场可以看..原创 2021-06-01 09:52:56 · 81 阅读 · 0 评论 -
Jquery 对 Anchor 的一些处理
Anchor 定位准确jQuery(document).ready(function() {var anchorlink = location.href.split('#')[1];jQuery('html, body').animate({scrollTop: jQuery('#'+ anchorlink).offset().top - 100}, 800);});jQuery(document).ready(function() {var link = location.href原创 2021-04-22 16:21:58 · 175 阅读 · 0 评论 -
cookies,sessionStorage 和 localStorage
面试问题:如何实现浏览器内多个标签页之间的通信既请描述一下 cookies,sessionStorage 和 localStorage 的区别?cookie在浏览器和服务器间来回传递。 sessionStorage和localStorage不会 sessionStorage和localStorage的存储空间更大; sessionStorage和localStorage有更多丰富易用的接口; sessionStorage和localStorage各自独立的存储空间; 本地离线存储 local原创 2021-04-22 15:34:56 · 93 阅读 · 0 评论 -
jquery 的 表单验证
Http 跳转到 Https<script type="text/javascript">//<![CDATA[if (!/https:/.exec(location.href)) { location.replace(location.href.replace("http:", "https:")); }//]]></script>Emial 验证<p><label for="email"><span clas.原创 2021-04-22 15:20:53 · 213 阅读 · 0 评论 -
Tracy JS 小笔记 - 正则表达式
1 . 校验密码强度密码的强度必须是包含大小写字母和数字的组合,不能使用特殊字符,长度在8-10之间。^(?=.*\\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$2. 校验中文字符串仅能是中文。^[\\u4e00-\\u9fa5]{0,}$3. 由数字、26个英文字母或下划线组成的字符串^\\w+$4. 校验E-Mail 地址同密码一样,下面是E-mail地址合规性的正则检查语句。[\\w!#$%&'*...原创 2021-04-22 14:52:22 · 288 阅读 · 0 评论 -
Jquery - Tracy 小笔记
Jquery选择器$("ul li:first") 每个 的第一个 元素 $("[href$='.jpg']") 所有带有以 ".jpg" 结尾的属性值的 href 属性 $("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。 $("[href]") 选取所有带有 href 属性的元素。 $("[href='#']") 选取所有带有 href 值等于 "#" 的元素。 $(this) 当前 HTML 元素 事件 $(document).r原创 2021-04-02 14:54:26 · 67 阅读 · 0 评论 -
是否是手机页面
如果手机浏览则跳转到特定的手机页面function browserRedirect() {var sUserAgent = navigator.userAgent.toLowerCase();var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";var bIsMidp = sUserAgent.match(/midp/i)原创 2021-04-02 14:25:32 · 118 阅读 · 0 评论 -
根据页面路径 来给 bluemix 加 local url
// Chinese (Simplified) - /cloud-computing/bluemix/zh/// Chinese (Traditional) - /cloud-computing/bluemix/zh-hant/// French - /cloud-computing/bluemix/fr/// French (Canadian) - /cloud-computing/bluemix/ca-fr/// German - /cloud-computing/bluemix/de///.原创 2021-04-02 13:43:09 · 126 阅读 · 0 评论 -
判断字符串是否以 endStr 为结尾
String.prototype.endWith=function(endStr){ //判断字符串以 endStr 为结尾 let d=this.length-endStr.length; return (d>=0&&this.lastIndexOf(endStr)==d);}原创 2021-03-29 13:37:05 · 764 阅读 · 0 评论