- 博客(23)
- 资源 (1)
- 收藏
- 关注
原创 TypeScript 基础类型
Null 和 Undefined 是其他任何类型(包括 void)的子类型,可以赋值给其它类型,如数字类型,此时,赋值后的类型会变成 null 或 undefined。never 是其它类型(包括 null 和 undefined)的子类型,代表从不会出现的值。// 运行正常 x = [1, 'Runoob'];// 在元素类型后面加上[] let arr: number[] = [1, 2];元组类型用来表示已知元素数量和类型的数组,各元素的类型不必相同,对应位置的类型需要相同。表示一个空对象引用。
2023-04-17 11:41:23
118
1
原创 使用echarts+echarts-gl绘制3d地图
使用 http://datav.aliyun.com/portal/school/atlas/area_selector 这个工具获取要显示的地图数据。首先在项目中安装echarts与echarts gl(echers gl用于3d)npm install echarts --save //echarts安装命令。npm install echarts-gl //echarts-gl安装命令。安装完成后在package.json中查看有没有安装成功。这样就生成了一个3d地图,如下图:(以山西地图为例)
2022-09-29 13:59:29
14182
1
原创 在vue中生成二维码
这样就可以生成一个二维码了,但是在使用是发现当你多次调用这个方法时会多次生成二维码,这里外面需要进行一下判断,然后把之前生成的二维码清空掉。基本配置就完成了,接下来在html与js里写东西就可以了。然后调用一下这个方法就可以生成二维码了。这里使用的是一个插件qrCode。安装之后在要使用的页面引入一下。在vue中生成二维码。
2022-08-24 08:52:05
795
原创 用小程序完成简单的详情列表功能
最近学习了微信小程序,写了一个详情列表主要思路是:1.先通过接口拿到数据,在onLoad(options){}中调用wx.request(){}函数,获取到数据2.完成数据渲染后,,用catchtab给它绑定一个点击事件,点击的时候跳转路由同时把id传到详情页,调用另一个接口拿到详情数据3.在以上工作都完成后,还有一个上拉触底获取到新数据更新到页面上的功能,在这个函数中再次调用获取数据时的代码,然后传一个页码,用来获取新的数据,把新的数据放到旧的数组里,就实现了。具体如下如下图:在js文件中
2022-05-27 16:38:14
3363
3
原创 对this的理解以及this指向
this 指向函数运行时所属的对象this 不指函数本身,也不指函数所对的作用域,指向调用此函数的对象this 指向分为六种情况1) 全局函数中的this,在全局环境下调用的时候指向window注意:如果全局函数内部是严格模式,则在全局环境下不指向window 指undefined2) 函数被赋值给某个事件时,指向绑定事件的对象3) this在对象的方法中使用时,指向的是 方法所属的对象4)在闭包中 this 指向window5) 在构造函数中以及构造函数的原型对象中的this,都.
2022-04-18 20:07:25
246
原创 HTML5的新增标签
html5新增标签:语义化更好多媒体功能:video\audio表单功能增强新的属性本地存储获取拖拽内容信息地理位置信息canvas画布<header>-----定义页眉<nav>---------定义导航<article>------定义文章<main>------定义主体<section>-----定义文档中的节(section、区段)<aside>-------定义文章的侧边栏<footer&g
2022-04-18 20:01:45
267
原创 input的新类型(新控件)与input的新属性
input新增:email : 提交表单时检测值是否是一个电子邮件格式url: 提交表单时检测值是否是一个url格式date: 年-月-日格式的控件time: 时:分格式的控件datetime-local : 年-月-日 时:分 格式的控件(本地时间)month : 年-月格式的控件week: 年-周数格式的控件number: 数字输入框Range : 选择区域tel: 电话输入框search: 用于搜索color: 调用系统选色器input新属性placeholder: 占位符
2022-04-18 19:59:47
275
原创 面试题No.1
1.双向数据绑定的原理vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应监听回调。当把一个普通 Javascript 对象传给 Vue实例来作为它的 data选项时,Vue将遍历它的属性,用Object.defineProperty()将它们转为getter/setter。用户看不到getter/setter,但是在内部它们让Vue追踪依赖,在属性
2022-04-12 20:24:39
88
原创 map数据类型
map数据类型map对象保存键值对任何值(对象或者原始值)都可以作为一个键或一个值maps和objects的区别一个object的键只能是字符串或者Symbols,但一个map的键可以是任意值map中的键值是有序的(FIFO原则)而添加到对象中的键值则不是map的键值对个数可以从size属性获取,而object的键值对个数只能手动计算object都有自己的原型,原型链上的键名有可能和你自己在对象的设置的键名产生冲突map.set(key,value)存储数据 map.get(key)获取数据
2022-04-10 19:26:47
235
原创 prototype和__proto__关系
原型对象 prototype每一个函数都一个原型对象,绑定到原型对象上的属性和方法是公共的每一个对象上都有一个__proto__对象,只有函数对象才有prototype,proto__是一个指针,它指的是构造它的对象的prototype(实例化对象的__proto 指向构造函数的原型对象)原型链当对象访问属性和方法的时候,先从自己的内存中去找,如果找不到就去构造函数的原型中去找,同一个构造函数new出来的对象,使用__proto__添加的属性和方法通过这个函数new出来的其他对象也能使用.
2022-04-10 19:23:29
496
原创 ajax教程
AjaxJSON的优势:轻量级,体积小,节省流量,提高加载速度解析成原生JS对象,解析比XML更快查找数据无需查找标签,更快将JOSN字符串转换为JOSN对象方法一. var obj = eval('(' + str1 + ')');方法二. var obj = JSON.parse(str1);将JSON对象转化为JSON字符串var obj2=JSON.stringify(str2);1. 简介:AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,与服务器交
2022-04-06 20:26:51
793
原创 事件之冒泡,监听与委托
事件冒泡或捕获概念当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的onclick事件也会被触发。js里称这种事件连续发生的机制为事件冒泡或者事件捕获。事件冒泡或事件捕获都有传播的特征阻止事件传播的方法:在W3C中使用 Event.stopPropagation();`在这里插入代码片`在IE中使用 Event.cancelBubble=true;事件监听事件监听可以改变事件机制,可以实现冒泡或者捕获2.可以给同一个元素绑定多个相同的事件.
2022-04-01 19:29:04
351
原创 js获取对象的方法
获取标签对象的方法获取标签对象的方法1) 通过id获取 document.getElementById(‘box1’)2) 通过类名获取 var boxs =document.getElementsByClassName(‘box’); 得到的结果是一个类数组格式,可以通过下标获取对象boxs[0], 如果下标超过最大长度得到undefined而不会报错3) 通过标签名获取var lis=document.getElementsByTagName(‘li’); 得 到的结果是一个类数组格式,
2022-03-31 19:54:23
7378
原创 for循环与while循环以及一些for循环的案例
for循环:需要重复的代码 有规律的代码 for(初始值; 判断条件 ; 自加/自减){ 代码块 } 注意:判断条件执行完执行代码块, 代码块执行完之后执 行自加/自减打印100之内的和 var a=0; // 保存求和的结果 for(var i=0;i<100;i++){ console.log(i); // a=a+i; a+=i;
2022-03-30 19:37:22
563
原创 JavaScript中的简单数据类型
简单数据类型(原始数据类型存在栈中undefined 未定义 值:undefined (1)变量被声明了,但没有赋值时,就等于undefined。 (2) 调用函数时,应该提供的实参没有提供,该形参等于undefined。 (3)对象没有赋值的属性,该属性的值为undefined。 (4)函数没有返回值时,默认返回undefined。 (5) 当获取数组数据的下标超过数组的长度的时候,则该数据的值是undefinednull 空对象 值:null.
2022-03-29 19:33:33
1078
原创 cookie存储,localStorage存储和sessionStorage存储
cookie和本地存储cookie概念1.会话跟踪:一个用户的所有请求操作都应该属于同一个会话,而另一个用户的所有请求操作则应该属于另一个会话,二者不能混淆。例如,用户A在超市购买的任何商品都应该放在A的购物车内,不论是用户A什么时间购买的,这都是属于同一个会话的,不能放入用户B或用户C的购物车内,这不属于同一个会话。2. 为什么有cookie而Web应用程序是使用HTTP协议传输数据的。HTTP协议是无状态的协议。一旦数据交换完毕,客户端与服务器端的连接就会关闭,再次交换数据需要建立新的连接。这
2022-03-28 19:31:02
346
原创 js面向对象
面向对象如何创建一个对象 实现 属性私有 方法共享function Obj(name,age){this.name=name;this.age=age;this.fn()}Obj.prototype.fn=function(){console.log(this.name);}var o=new Obj('张三',50) 创建对象的方式有几种直接给对象绑定属性和方法Var obj = new Object()Obj.age = ‘18’通过字面量创建对象V
2022-03-27 20:13:38
292
原创 数组的一些方法
数组的一些方法数组:是一组数据的集合,数组可以包含任何数据类型 数组的格式 arr=[] 数组的属性 : 数组的长度 arr.length 获取数组的某个值: arr[下标] 下标:从0开始 修改数组的某个值:arr[0]=新值push() // 往数组最后插入数据 并且可以返回数组的长度unshift() // // 往数组最前面插入数据 并且可以返回数组的长度a.pop()
2022-03-27 20:03:03
305
原创 弹性盒子---flex
flex弹性布局概念:flex是flexible Box的缩写,意味’弹性布局’,用来为盒状模型提供最大的灵活性,采用flex布局的元素,称为flex容器,简称’容器’,他的子元素自动成为容器成员使用:display:flex或inline-flex ,那么这个元素就成为容器==>弹性盒子特点:子元素会自动成为容器成员我们可以称他们为项目item注意:定义成flex以后,容器里面浮动将会失效,float , clear , vertical失效,默认子元素不会自动换行父元素属性 flex-
2022-03-24 20:15:59
132
原创 什么是跨域,如何解决跨域?
什么是跨域,如何解决跨域?违反同源策略就是跨域如何解决1、jsonp跨域JSONP(JSON with Padding:填充式JSON),应用JSON的一种新方法,JSON、JSONP的区别: 1、JSON返回的是一串数据、JSONP返回的是脚本代码(包含一个函数调用) 2、JSONP 只支持get请求、不支持post请求 (类似往页面添加一个script标签,通过src属性去触发对指定地址的请求,故只能是Get请求)2、nginx反向代理: www.baidu.com/index
2022-03-20 17:18:14
90
原创 vue中的导航守卫
导航守卫:监听每一个路由的跳转过程,然后提供一些钩子让你有机会在路由跳转过程植入相关信息,多用于登录验证等全局前置守卫:router.beforeEach全局解析守卫router.beforeResolve全局后置钩子router.afterEach路由独享守卫beforeEnter组件内守卫 进入组件前:beforeRouteEnter组件内守卫 组件重新加载时:beforeRouteUpdate组件内守卫 离开组件时:beforeRouteLeave全局前置守卫,任何路径跳转都要经过他
2022-03-17 19:41:42
474
原创 在vue中安装axios库
在vue项目中输入npm install --save axios vue-axios,用npm安装axios库在入口文件main.js引入import axios from 'axios'import VueAxios from 'vue-axios'Vue.use(VueAxios, axios)组件中使用要引入import axios from 'axios';普通get传参this.axios.get('list.json?id=18').then(a=>{ c
2022-03-16 19:57:33
983
原创 hash与history 以及区别
hash路由hash模式是通过改变锚点(#)来更新页面URL,并不会触发页面重新加载,我们可以通过window.onhashchange监听到hash的改变,从而处理路由window.location.hash = 'qq' // 设置 url 的 hash,会在当前url后加上 '#qq'var hash = window.location.hash // '#qq' window.addEventListener('hashchange', function(){ // 监听ha
2022-03-14 17:40:44
594
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人