- 博客(27)
- 收藏
- 关注
原创 React事件绑定this指向的问题
**只有通过script链接引入才会存在这个问题,使用create React App 创建react项目则不会存在该问题。**<script type="text/babel"> class Toggle extends React.Component{ constructor(props){ super(props); this.state={
2021-07-30 16:42:14
125
原创 微信小程序多选标签的实现(单选或者多选)
暑假留在社团跟别人一起开发一个校园小程序,如今也基本快开发完成了,整理一下日后可能用到的小组件。类似于上图,下方的待选项为一个组件,根据父组件传入传入的参数决定是否为多选。父组件的HTML代码如下<view class="my-tag"> <view class="tag-des" > <text>个人标签</text> <text class="tips-text" wx:if="{{ !alre.
2021-07-26 10:47:15
3745
1
原创 Promise实现并发
class Schedule{ constructor(maxtask){ this.list = []; this.maxtask = maxtask; this.worknum = 0; }; add(...task){ this.list.push(...task) }; start(){ for(let i = 0;i<this.maxtask;i++){.
2021-06-20 16:10:25
197
原创 ES6新增的reduce究竟有多强大?
端午节三天的假期,因为没有带电脑回家所以无聊的时候就只能通过手机翻翻文档,于是,意外的发现,reduce真的太强大了。在此之前,我一直只是简简单单的把reduce用于求和,但其实他还有很多有意思的用法。例如,实现Promise的顺序执行,例如有多个Ajax请求,后一个请求依赖于前一个请求的结果(现在也可以用await async实现),这时候就必须保证只有前一个请求完成才能进行下一个请求。代码如下:在这里插入代码片...
2021-06-15 16:40:51
190
原创 函数柯里化的实现过程及隐式转化。
实现一个函数add(1)(2)一想,这不是很简单。function add(num){ let sum = num; return function(num){ return sum+num } }console.log(add(1)(2));然后又问,如何实现add(1)(2)(3)…总不能无限嵌套下去吧。于是,就想到了返回一个函数名,在函数内部判断是否还有参数传进来 function add(num){ let sum =num;
2021-06-13 10:46:26
150
原创 typeof和instanceof判断数据类型的原理。
console.log(typeof null);输出什么?Obejct。这个问题很多人都知道,但是,为什么输出的是Object?原因就在于js在存储数据的时候,会用低位数(前三位)去存储数据类型。其中:000:对象010:浮点数100:字符串110:布尔1:整数但是对于null,undefine来说,null所有的机器码均为000与对象的前三位一致,所以就会出现误判的情况。instanceo判断数据类型得原理就是通过原型链的查询。(附代码)function myinstance
2021-06-09 10:47:07
516
原创 编程题之获取url参数
****描述**获取 url 中的参数指定参数名称,返回该参数的值 或者 空字符串不指定参数名称,返回全部的参数对象 或者 {}如果存在多个同名参数,则返回数组不支持URLSearchParams方法示例1**输入:http://www.nowcoder.com?key=1&key=2&key=3&test=4#hehe key复制输出:[1, 2, 3]****先上自己写的代码。。奇丑无比function getUrlParam(sUrl, sKey)
2021-06-06 22:11:58
166
原创 奇奇怪怪的知识又增加了————做下拉菜单遇到的一个小问题。
昨晚在写一个静态页面的时候,写了一个下拉菜单。预想情况是点击之后出现的下拉菜单应该把下面的开始时间结束时间一起往下推,**但是,出现了一个神奇的现象**如图????这跟我预想的咋完全不一样?一开始以为是定位的问题导致元素脱离了标准流好吧那就将错就错。于是,就继续做下去(昨晚写的时候已经挺晚的了,只想着写完。)但是,又发现了一个小Bug,点击选项的时候对应的事件无法触发??触发的是在开始时间对应的绑定事件(其实这里的图层关系是开始时间这一层是在菜单的上方的,所以导致点击的时候只触发了开始
2021-06-06 08:55:41
191
2
原创 给子盒子设定边距父盒子也跟着移动的解决方法 ————BFC
今天在写一个静态页面的时候,突然发现了一件神奇的事先上代码 <view class="baseinfo"> <view class="infobox"> <view class="lefticon"></view> <text class="title" >基本信息</text> </view> </view>.lefticon{ width: 32rpx;
2021-06-01 17:38:30
680
原创 剑指offer系列 -判断一个二维数组中是否有该数字
直接上题目在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序。请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数。[[1,2,8,9],[2,4,9,12],[4,7,10,13],[6,8,11,15]]给定 target = 7,返回 true。给定 target = 3,返回 false。看到的第一眼的想法就是数组扁平化处理。然后就用(Array.from(arr.join(’,’))arr
2021-06-01 09:27:50
181
原创 利用JSONP跨域请求腾讯天气(内附代码)
除了CORS实现跨域,也可以利用JSONP,不过JSONP只能实现get请求,并且受URL地址长度的限制。首先打开腾讯天气的网站,打开network,找到类型为script报文(双击查看哪个是请求天气的,记得下载jsonp插件),分析请求参数https://wis.qq.com/weather/common?source=pc&weather_type=observe%7Cforecast_1h%7Cforecast_24h%7Cindex%7Calarm%7Climit%7Ctips%7Cri
2021-05-31 21:10:33
1499
原创 简单封装call,bind,apply
主要还是看对this的指向熟不熟悉就简单说一下call吧(可能有点乱或者理解错误,还请见谅):传入的第一个参数是借用该方法的对象,比如obj1.say.call(obj2)就是obj2在借用obj1.say方法,如果要自己封装的话,应该在我们封装的方法里面获得obj1.say方法并进行添加到对象obj2里调用,这里的话就是我们在原型上添加的方法里面的this let obj1 = { name:'zhansan', age:12,
2021-05-28 16:43:45
185
原创 实现数组去重:感叹ES6的进步
为 Array 对象添加一个去除重复项的方法:输入: [false, true, undefined, null, NaN, 0, 1, {}, {}, ‘a’, ‘a’, NaN]输出:[false, true, undefined, null, NaN, 0, 1, {}, {}, ‘a’]不用Set语法:Array.prototype.uniq = function () { let falg = true //用于记录是否已经加入NaN; let arr = [] fo
2021-05-27 16:43:59
79
原创 用CORS模拟跨域
问起跨域,很多人都可以很轻松的说出JSONP(同源政策只限制XHR,而对于img,script的src没有限制,但是它只能通过get请求),CORS(服务器端设置)等等但是,让其不看资料手写一遍估计够呛的。比如我,今天尝试用CORS实现跨域,然而发现自己nodejs的早已忘完了。。发起跨域请求的服务器代码:const express = require("express");const app = express();const path = require("path")app.use(e
2021-05-26 20:12:16
407
原创 在for循环里用var实现let的效果
用for循环连续按顺序打印1,2,3,4,5(间隔1秒);于是噼里啪啦写出以下代码:for(var i =1;i<=5;i++){ setTimeout(() => { console.log(i); }, i*1000);}于是,一运行,不到啊,怎么都是打印6(涉及到事件循环)。然后你仔细看了以下代码,哦,把Var改成let不就可以了。运行了一下,确实可以。这时候面试官又来了一个问题,请换种方式实现。。What??利用闭包for(var i
2021-05-26 11:12:06
490
原创 事件俘获,冒泡,委托
JS的事件流如下:(图忘记在哪里偷的。。忘记了)类似于,往水里丢下去一块大石头,在沉下去的过程中石头是可以被俘获的(事件俘获),沉到底之后会往上冒泡泡(冒泡,通常用于事件委托,减少对DOM的操作)那么事件俘获和事件冒泡有什么用呢?事件俘获:我确实想不到有啥用。。一开始我以为可以进行拦截。。。事件冒泡的话就可以减少对DOM的操作,减少重排。 <style> ul>li{ width: 50px;
2021-05-25 22:00:09
59
原创 Promise的最简单封装(极其简陋版)
建议写的时候参照new Promise的过程去写function mypromise(fn){ const that = this; that.status = 'pedding'; that.value = ''; let falg =false //当没有调用resolve,reject函数时抛出错误 function resolve(val){ if( that.status == 'pedding'){
2021-05-24 21:06:44
100
原创 记笔记系列————正则表达式的分组俘获和回溯引用
如2019-274-077 想提取出2019,274,077可以使用分组俘获(\d{4})-(\d{3})-(\d{3}) hi (.+) .字符代表匹配任何单个字符,它只能出现在方括号以外。分组的回溯引用:例如匹配abba(\w)(\w)(\2)(\1)
2021-05-23 16:20:38
139
原创 async await使用的一些注意事项
async其实是Generator函数的一个语法糖,它具有更好的语义性,并且返回的是一个promise对象(Generator返回的是一个可遍历的对象)。 // async function asyn1(){ // return 'hello wrod' // } // asyn1().then(res => { // console.log(res); // })async函数的返回值会被当成.th
2021-05-21 16:34:16
436
原创 字符串的异构同质————牛客网平安科技试卷
function splitstr (str){ //反过来思考,要随意排序能相等则意味着两者必须长度一样 let str1 = str.split(" ")[0]; let str2 = str.split(' ')[1]; let arr1 = Array.from(str1); let arr2 = Array.from(str2); let result =true if(arr1.length != arr2.le.
2021-05-21 10:30:05
133
1
原创 js中的几种继承方式
继承方式:构造函数继承,原型继承,组合继承,寄生式继承,寄生式组合继承注:本篇博客可能存在理解错误,仅供参考,新手小菜鸡在说继承之前,先来说说原型链吧。说到原型链,你能想到什么?构造函数?原型对象?实例?他们之间的关系又是什么呢?构造函数可以通过new创建出一个实例对象(可见上篇博客new做了什么),实例对象又能通过__proto__访问原型对象,而原型对象又可以通过constructor访问其构造函数,构造函数可以通过prototype访问原型对象。是不是很绕,对的,确实很绕。那接下来看
2021-05-20 23:47:24
61
原创 javaSript中的new关键字做了什么?
//根据以下代码可以总结出,new关键字做了啥 // new有改变this指向 // 创建一个空对象 // 将创造出来的空对象的原型对象指向构造函数的原型对象(不懂的可以找找 //原型链还有继承的资料,或者等我下篇推文) function Person(name,age){ this.name = name this.age = age } ...
2021-05-19 16:13:57
74
原创 深浅拷贝的实现
js的6种基本数据类型:string,number,undefined,null,boolean,symbol(一直不清楚这个有啥用,翻了资料也没想明白,可能段为不够吧毕竟菜鸡本鸡。不重复唯一标识??)引用类型L:Object type :Object 、Array 、Function 、Data等基本数据类型是按值存放在栈中引用类型是把其地址存放在栈中,每次访问都先通过栈取得地址再从堆中取得真正的数据,所以也叫引用,类似C语言的指针?```html```javascript let obj
2021-05-18 23:24:32
50
原创 重学盒子模型(w3c的标准盒模型与ie6以下的盒子模型 )
盒模型有很多种,比如inline,inline-block,block,table等等。而盒模型由display,内距,外距,宽高,边框,position,float决定在css3中引入了盒模型属性box-sizing,共有三个属性值content-box:翻译过来就是内容盒,我理解为在这个属性下我设置的宽高都是只指内容(即元素)的大小,该盒子真正的大小还要加上内距,边框。(加起来是内盒),内容盒,也是w3c的标准盒子所以当宽高不变,给该盒子设置内距(padding)外距(margin)会撑大盒子
2021-03-04 23:08:07
199
1
原创 vue文档中的watch
<div id="app"> <span>这里是message</span> <input type="text" v-model = 'message'> <h4>{{message}}</h4> <span>这里是obj.name</span> <input type="text" v-model = 'obj.name..
2021-03-04 17:16:17
145
1
原创 父子组件传参时子组件的devtools可以监测到数据成功传递页面正常渲染但是控制台报错
提示title未定义,但我发现此时页面已经正常渲染成功,通过devtools工具发现数据也已经正常传递但是为什么还是会报错呢?通过网络请求的结果进行赋值(this.goodsdetails = res.result,再将goods details传递给子组件),在then里面进行赋值,这一步是异步操作,但是有可能一开始再子组件页面创建成功的时候,赋值操作还未完成,所以传递给子组件的对象未空,所以自然会出现报错title未定义。解决方案:在子组件一创建的时候进行判断传过来的数据是否为空,若为空.
2021-03-03 12:59:04
398
原创 用vue开发的小购物商城(购物车)踩坑日记(属于自己能看懂系列纯当做笔记)。
用vue开发的小购物商城(购物车)踩坑日记(属于自己能看懂系列纯当做笔记)。在每一个item里面我在一开始都将商品的checked状态赋值给isshow,于是,刚入坑不久的我天真的觉得isshow会随着this.listitem.checked的变化而变化,实际上并不会。于是只能通过watch去监听this.listitem.checked的改变于是问题得到解决其实最好的解决方案是通过v-model进行绑定。我一开始的时候也是想通过v-model进行绑定,但是会报错,原因就是我写这个
2021-03-03 11:11:01
410
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人