- 博客(95)
- 收藏
- 关注
原创 vue2计算属性内的get/set解析
在计算属性内,get/set字面意思是获取和设置操作,计算属性值根据依赖变量的值在get内return,set则是值改变时需要执行的区域。常规的computed写法,如果b变量在某个地方被更改的话,会报错。
2023-04-13 15:10:42 1473 1
原创 vue2简易路由复习
(官方语言:)所以呢,我们要在服务端增加一个覆盖所有情况的候选资源:如果 URL 匹配不到任何静态资源,则应该返回同一个 index.html 页面,这个页面就是你app依赖的页面。因为这种模式不好区分一个路由是前端路由还是后端路由,而浏览器默认认为是后端的,所以向后端的这个接口发请求,如果后台没有正确的配置,当用户在浏览器直接访问这个网址就会返回404。这种模式可以避免服务器配置的问题,而且支持所有浏览器,由于 URL 中添加了 hash,因此在搜索引擎的 SEO 优化中存在一些问题。
2023-04-12 23:59:14 251
原创 angular模块及组件使用复习
在自定义模块里引入自定义组件,需要在declarations数组内对组件进行定义,同时需要在exports数组内进行对外暴露导出。在test-module.component.html内使用web-test组件自定义模块-路由定义:App-routing.module内引入test-module模块,子test-module模块定义路由。
2023-04-12 23:51:13 312
原创 css绘制三角形、梯形及梯形带圆角
这里使用css绘制各种图形都是采用单节点的方式,未涉及多节点组合图形绘制。主要是多边形绘制,如三角形、梯形。绘制三角形绘制各种三角形是以css-border为基础展开,巧用border(top/bottom/left/right)的尺寸值及色值。下面看一个矩形.ex-grid { position: fixed; width:0; height: 0; border: 100px solid #6c9;}这是一个矩形,没有宽高值,border100px,也就
2021-10-14 23:05:02 5679
原创 整型-浮点型-进制转换
parseFloatparseFloat(string)可解析一个字符串,并返回一个浮点数(number类型)。parseIntparseInt(string, radix)可用于解析一个字符串,并返回一个整型。radix表示被解析的字符串的基数(进制)numbernumber()这里记录转换用法。如果参数无法被转换为数字,返回NaN。如字符串内含有字母就法务被转换。进制转换parseInt(string, radix);任意进制转十进制,也只能由其他进制类型向十进制转换。number.
2021-10-07 22:58:12 200
原创 angular2-HttpClient服务器端请求通信
app.module.ts文件内引入httpClient模块import { HttpClientModule } from '@angular/common/http';@NgModule({ imports: [ HttpClientModule, ],})***.component.ts内引入httpClientimport { HttpClient } from '@angular/common/http';export class ***Component impl
2021-10-07 22:46:41 205
原创 await-async异步任务解决方案
await-async异步任务解决方案async functions 和 await 关键字是最近添加到JavaScript语言里面的。是ECMAScript 2017 JavaScript版的一部分。简单的说,它们是基于promise的语法糖,是异步代码更易于编写和阅读。asyncasync function返回的是一个promise。按照文档释义:async函数是使用async关键字声明的函数。async函数是asyncFunction构造函数的实例,并且其中允许使用await关键字。fun
2021-09-27 00:01:58 294
原创 angular2-directives指令
属性型指令创建一个自定义hightlight指令示例。import { Directive, ElementRef, HostListener } from '@angular/core';@Directive({ selector: '[appHighlight]'})export class HighlightDirective { constructor(private el: ElementRef) {} @HostListener('mouseenter') onMou
2021-09-03 22:16:06 176
原创 力扣题库练习
1给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 target 的那 两个 整数,并返回它们的数组下标。你可以假设每种输入只会对应一个答案。但是,数组中同一个元素在答案里不能重复出现。你可以按任意顺序返回答案。示例:输入:nums = [2,7,11,15], target = 9输出:[0,1]解释:因为 nums[0] + nums[1] == 9 ,返回 [0, 1]本人简单暴力解答:var twoSum = function(nums,
2021-08-25 23:02:59 190
原创 javascript-for循环-退出循环-break&label标签
跳出循环是一个常见的应用场景,跳出循环的方法也不止一种。var twoSum = function(nums, target) { let a=0,b=0; for(let i=0;i<nums.length;i++){ for(let j=0;j<nums.length;j++){ if(i!=j){ if(nums[i]+nums[j] === target){ a=i;b=j;
2021-08-25 22:59:55 365
原创 javascript-类数组学习
JavaScript类数组array like object什么是类数组类数组就是js对象。类数组不是数组,其是长得像数组的对象(数组本质也是对象)。一个类数组对象具备的特点:使用数字作为属性名称;具备length属性;一个完整的类数组对象例子:const obj = { 0: ‘a’, 1: ‘b’, 2: ‘c’, 3: ‘d’, length: ‘4’}类数组具备length属性,可以被for循环遍历。for(let i=0;i<obj.length;i++)
2021-08-25 22:57:41 115
原创 call-apply-bind浅显理解
call-apply-bind解析call/apply/bind三个作用大致相似但使用方式又有所不同,都与this有关,它们都是用来重定义this对象的。按照我个人的理解就是借用,即自身以及原型上没有某种方法,通过借调的方式借来此种方法,参数数据还是使用自身的。callfunction Person(name, age){ this.name = name; this.age = age;}function Student(name, age, grade){ Person.cal
2021-08-25 22:55:08 120
原创 C碎片化基础知识
C碎片化基础知识变量定义type variable_list;Type是一个有效的c数据类型,可以是char、w_char、int、float、double或任何用户自定义的对象。有效声明:int i, j, k;char c, ch;float f, salary;double d;常量定义#define预处理器#define identifier value#define LENGTH 10#define WIDTH 5#define NEWLINE '\n
2021-08-25 22:51:07 138
原创 React-使用小结
React-使用记录class类名return (<div className=”test”>test</div>)多个类名&动态类名1.return (<div className={[”test-01”,”test-02”, str?’test-02’:’test-03’].join(‘ ’)}>test</div>)return (<div className={`test-01 ${str?’test-02’:’te
2021-07-19 23:39:31 169 2
原创 angular知识总结
templatetemplate内容模板元素,是一种用于保存客户端内容机制,此内容在加载页面时不会呈现,运行时可被js实例化。DocumentFragment表示一个没有父级文件的最小文档对象,常被作为一个轻量版的Document使用。是Dom节点,不是真实Dom树的一部分。在Dom树种,文档片段被其所有子元素代替。因为文档片段存在内容中,不存在Dom树中,将元素插入文档片段时,不会引起回流。<table id="producttable"> <thead>
2021-06-06 19:23:48 331 2
原创 angular使用记录
此版本angular-cli版本是9.1.6,更新最新版本npm uninstall -g @angular/cli // 老版本是写npm uninstall -g angular-clinpm cache clean -fnpm install -g @angular/cli@latest模块化:是从代码逻辑的角度进行划分;方便代码分层开发,保证每个功能模块的职能单一;组件化:是从UI界面的角度进行划分,前端的组件化,方便UI组件的重用Angular工程属于模块化开发的思想,angu.
2021-05-28 23:14:20 184 3
原创 css-缓动效果贝塞尔曲线-cubic-bezier
css-缓动贝塞尔曲线-cubic-beziercubic-bezier是控制变化的速度曲线。贝塞尔曲线由至少两个控制点进行描述。WEB中使用的是三次贝塞尔曲线,即使用四个控制点[P0,P1,P2,P3]描述的曲线。cubic-bezier(, , , )实际上可以理解为两个坐标点数据,X轴的取值范围是0-1,超出会失效;y轴的取值无限制,参考范围0-1,不宜过大。ease - cubic-bezier(.25,.1,.25,1)linear - cubic-bezier(0,0,1,1
2021-05-28 23:05:07 812
原创 js-数据结构map使用案例
js-数据结构map使用案例求出字符串中无重复字符的最长子串长度let test = 'abcabcbb';// 输出无重复字符的最长字串 3function lengthOfLongestSubstring(s){ let len = s.length; // 8 let hashMap = new Map(); let start = 0; let end = 0; let maxLen = 0; while(end < len){ // end < 8
2021-05-28 23:02:33 280
原创 js-array-map方法使用和仿造
js-array-map方法使用map()方法创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。let newArray = [1,2,3,4,5,65,'a','cc'];newArray.map((item, index)=>{ console.log(item, index);});使用变量接收回传数组let targetArray = newArray.map((item,index)=>{return item});console.log(
2021-05-07 23:31:53 317
原创 three.js顶点概念知识点
three.js-顶点点let geometry = new THREE.BufferGeometry();let vertices = new Float32Array([ 0, 0, 0, //顶点1坐标 50, 0, 0, //顶点2坐标 0, 100, 0, //顶点3坐标 0, 0, 10, //顶点4坐标 0, 0, 100, //顶点5坐标 50, 0, 10, //顶点6坐标]);let attribue = new THREE.B
2021-04-04 18:15:12 621
原创 three.js立方体六面贴图做法解析
three.js立方体六面图片贴图// 案例1var path = "resources/textures/cube/pisa/";var format = '.png';var urls = [ path + 'px' + format, path + 'nx' + format, path + 'py' + format, path + 'ny' + format, path + 'pz' + format, path + 'nz' + format];let geometry = n
2021-03-29 23:31:12 1731
原创 three.js-EffectComposer辉光使用展示
three.js辉光EffectComposer – 效果合成器import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer';import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass';import { OutlinePass } from 'three/examples/jsm/postprocessing/O
2021-03-23 22:52:43 635
原创 three.js-外部载入模型动画实现
载入模型动画实现模型本身自带动画(三维软件制作),如何在模型导入到网页后使动画生效声明mixers数组用于保存动画声明clockdata() { return { mixers:[], clock:new THREE.Clock(),}},Methods: { Init(){let loader = new FBXLoader();loader.load('resources/demo-models/model/view2.fbx', fbx =>
2021-03-21 00:43:56 627 1
原创 three.js-模型线框化
模型线框wireframe支持线框模式的材质有MeshBasicMaterial、MeshDepthMaterial、MeshLambertMaterial…基础模型线框模式:let sphereGeometry = new THREE.SphereGeometry(10, 30, 30);let meshMaterial = new THREE.MeshBasicMaterial({color:0xaaafff});meshMaterial.wireframe = true;let sphe
2021-03-21 00:39:45 1607
原创 three.js-tween-camera相机视角平滑转换
camera相机视角平滑过渡转换使用tween特性进行视角的平滑过渡。过渡方式释义Linear线性匀速运动效果Quadratic二次方的缓动(t^2)Cubic三次方的缓动(t^3)Quartic四次方的缓动(t^4)Quintic五次方的缓动(t^5)Sinusoidal正弦曲线的缓动(sin(t))Exponential指数曲线的缓动(2^t)Circular圆形曲线的缓动(sqrt(1-t^2))Elastic指
2021-03-21 00:35:33 2120
原创 css实现毛玻璃实景局部虚化
css实现毛玻璃效果-强悍版实景局部虚化<div class="filter"><div class="box"></div></div>.filter{ position: relative; width:500px; height: 312px; margin:10rem; background: url(./image/view.jpg) no-repeat 0px 0px / 500px 312px;
2021-03-21 00:32:16 611
原创 react组件认识使用&组件提升解析
认识组件react组件使用import NameCard from './components/NameCard.js';class App extends Component { constructor(props){ super(props); this.state = { obj:{ name:'std', number:123, } } } render() { return (
2021-03-15 23:51:13 82
原创 javascript-Reflect.ownKeys、Object.keys、Object.getOwnPropertyNames、for-in
Reflect.ownKeys官方文档解释:静态方法Reflect.ownKeys返回一个由目标对象自身的属性键组成的数组。语法Reflect.ownKeys(target)const obj = { property1:'test', property2:10029,}; console.log(Reflect.ownKeys(obj));const arr = [];console.log(Reflect.ownKeys(arr));target获取自身属性键的
2021-03-01 21:44:35 725
原创 php引用学习
释义:在PHP中引用意味着用不同的名字访问同一个变量内容。并不像C的指针:例如不能对它们做指针运算,它们并不是实际的内存地址…引用可以被看作是Unix文件系统中的硬链接。例:$array1 = array(1,2);$x = &$array1[1];$array2 = $array1;$array2[1]=30;print_r($array1);引用做什么引用赋值PHP的引用允许用两个变量来指向同一个内容。当这样做时:$a = &$b;这意味着$ a和$ b
2021-02-28 23:46:55 71
转载 PHP中=>、->、::的用法记录
☆=>$css = array('style' => '0', 'color' => 'green');$css['style']==='0',$css['color']=='green';☆->$arr=['a'=>123,'b'=>456];//数组初始化echo $arr['a'];//数组引用print_r($arr);//查看数组class A{ public $a=123; public $b=456;}$obj=new A();
2021-02-28 23:34:14 151
原创 css-十六进制8位带透明度色值(6位色值+2位透明度值)对照
css十六进制8位带透明度色值(6位色值+2位透明度值)使用对照表数值透明度值数值透明度值数值透明度值数值透明度值数值透明度值0002136426B63A184D61032238436E64A385D9205233B447065A686DB308243D457366A887DE40A2540467567AB88
2021-02-23 23:47:47 2922
原创 JavaScript原型&原型链浅解
原型任何对象都有一个关联的原型对象,这个原型对象由对象的内置属性__proto__指向它的构造函数的prototype指向的对象。也就是说任何对象都是由一个构造函数创建,被创建的对象都可以获得构造函数的prototype属性。对象没有prototype属性,只有函数才有prototype属性。任何对象都有一个constructor属性,指向创建此对象的构造函数,比如说{}对象,它的构造函数是function Object(){}。原型链因为每个对象和原型都有原型,对象的原型指向原型对象,而
2021-02-22 23:08:13 160
原创 php-goto使用认识
echo "start\r\n";goto codeMark;echo 'E1';codeMark:echo 'F1';结果:跳过了“echo “E1””,也就是说goto是与程序执行跳转有关,比较类似于 break,但又完全不同。goto操作符可以用来跳转到程序中的另一个位置,该目标位置可以用目标名称加上冒号来标记,而跳转指令是goto之后接上目标位置的标记。PHP中对goto有一定的限制,目标位置只能位于同一个文件和作用域,也就是说无法跳出一个函数或类方法,也无法跳入到另一个函
2021-02-16 18:28:53 145
原创 php-declare的使用解析
declaredeclare结构用来设定一段代码的执行指令。declare的语法和其他流程控制结构相似:declare (directive) statementdirective部分允许设定declare代码段的行为。目前只认识三个指令:ticksencodingstrict_types因为该指令是在文件编译时处理的,所以指令只接受字面量的值,无法使用变量和常量,如下:// 有效declare(ticks=1);// 无效const TICK_VALUE = 1;decla
2021-02-15 23:04:14 234
原创 php-新特性之match解析
在PHP8 alpha2发布引入了一个新的关键字:match。刚在本地尝试使用match,结果报“unexpected”错误,其实并无错误,需要将php版本更新。match与switch有些许类似。match可以用来做什么?简单的match案例:// match解析$result = match(2){ 1 => 'One', 2 => 'Two',};var_dump($result);结果:看如下代码:// match解析$age = 20;
2021-02-15 22:17:08 895
原创 html5新特性 - 地理定位geolocation学习
Html5新特性-地理定位geolocation用于定位用户的位置。 window.navigator.geolocation { getCurrentPosition:fn, watchPosition:fn, clearWatch:fn}获取用户定位信息 window.navigator.geolocation.getCurrentPosition(function(pos){ console.log(“获取成功”); // po
2021-01-31 20:41:48 120
原创 三角函数复习
数学三角函数:在直角三角形中,当平面上的三点A、B、C的连线,AB、AC、BC,构成一个直角三角形,其中∠ACB为直角。对∠BAC而言,对边(opposite)a=BC、斜边(hypotenuse)c=AB、邻边(adjacent)b=AC,则存在以下关系:...
2021-01-28 22:23:07 772
原创 角度与弧度之间的换算
最近在看svg绘图碰到弧度制角度&角度制角度,温习记录下弧度与角度间的换算。角度转弧度:π/180 * 角度弧度转角度:180/π * 弧度一周的弧度数为2πr/r = 2π,也就是说360°=2π弧度,因此,1弧度约为57.3°,即57°17’44.806,1°为π/180弧度,近似值为0.01745弧度,周角为2π弧度,平角(180°)为π弧度,直角为π/2弧度。扩展资料:弧长=nπr/180,在这里n就是角度数,即圆心角n所对应的弧长。但如果我们利用弧度的话,以上的式子将会变得更
2021-01-26 23:16:31 20141
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人