aiyx16521的博客

2021-04-26

cjmxcc — Mon, 26 Apr 2021 16:02:57 +0800

什么是类数组：　　　　上一个例子：　　　　输出结果：类数组是指在写法上跟数组一样，例如 arguments 和 length 写法上跟数组一样，不具有数组所具有的方法但类数组，只是一个普通的对象，他的原型是Object。而真实的数组是Array类型。、把对象变成数组的方法： ...

路由复习

cjmxcc — Sun, 21 Mar 2021 23:59:09 +0800

spa:single page application 单页面应用提供一个舞台。舞台当中呈现的是组件，具体呈现的组件由地址决定。 react路由:根据路径决定要使用哪一个组件组件：路由组件：由路由控制普通组件：页面当中使用的组件 1，下载路由模块 cnpm install react-router-dom -S 2，引入 import { BrowserRouter as Router,//路由器 Route//路由，必须被Router包裹 NavLink, Link, Switch, Hash

vue组件间的通讯方式汇总

cjmxcc — Fri, 19 Feb 2021 18:52:01 +0800

vue组件间的通讯方式 1，组件间通信（父向子）：props 子如何修改父的数据？转存一份在子组件中直接修改（各个子组件中数据独立）通过vue自定义事件通知父组件已改（各个子组件中数据公用） 2，组件间通信（子向父）：vue自定义事件 3，组件间通信（非父子）：事件总线pubsub 4，组件间通信：普通插槽，具名插槽，作用域插槽 5，组件间通信：vuex 6，如果有路由环境可以通过url进行组件数据传递 7，localStroage seesionStroage 8，event深入：如果event深入

Vue钩子生命周期函数

cjmxcc — Mon, 18 Jan 2021 20:43:06 +0800

Title

vue组件传值

cjmxcc — Mon, 18 Jan 2021 20:41:19 +0800

父向子传值通过标签属性传值如果子组件的props接收了那这个标签属性就具有props特性如果子组件的props没有接收那这个标签属性就是一个普通的自定义属性。父组件如何向子组件传值父组件通过标签属性的形式向子组件传值。子组件可以通过props属性正常接收到来自父组件的值。但值得注意的是子组件接收到父组件的值后不应该修改接收到的值，因为该值果然是一个对象，而且被几个子组件共同引用着，很有可以会导致脏数据。非得要改怎么办？转存一份，再改。在vue中组件传值是要单项数据流的，子组件不能随

定时器setTimeout输出问题

cjmxcc — Wed, 13 Jan 2021 20:53:38 +0800

setTimeout(function(){ console.log(1); },1000) console.log(2); 输出：2，1 var btn = document.querySelector("#btn"); btn.onclick=function(){ console.log("onclick") }; setTimeout(function(){ console.log(1); },1000) console.log(2); .

this函数的劫持

cjmxcc — Wed, 13 Jan 2021 20:38:24 +0800

// 使用forEach的第二个参数来固定死this // 使用bind函数固定死this // 使用this劫持(鸡肋闭包) // 使用箭头函数来固定死this //箭头函数的this指向其上一层作用域挂靠的执行上下文中的this //建议所有的回调函数使用箭头函数 var obj = { name:"达姆", wifes:["冬雨","a","b","c","d"], //当函数以另外一个函数作为参数;或者一个函数返回另外一个函数; // 那当前这个函数可以称为高阶函数

深度详解Promise

cjmxcc — Wed, 13 Jan 2021 20:36:09 +0800

Promise之执行器本质上Promise就是一个构造函数。 Promise的实例对象有三个状态 pending: 初始状态，既不是成功，也不是失败状态。 fulfilled: 意味着操作成功完成。(resolved) rejected: 意味着操作失败  Promise语法 new Promise( function(resolve, reject) {…}); //第一个参数一般我们称为executor //实例 var promise = new Promise(function(resolve

JS属性查找的规则

cjmxcc — Tue, 12 Jan 2021 20:55:50 +0800

1、属性普通定义 // var a = "a"; // console.log(window.a) // console.log(a) //基本的属性定义形式 var key = "wife"; var key2 = "son"; var obj = { name:"damu", [key2]:"小达姆" }; obj.age = 18; obj[key]="冬雨"; console.log(Object.getOwn

JS变量查找的规则

cjmxcc — Tue, 12 Jan 2021 20:09:57 +0800

1、变量查找的规范左查询(对等号左边的变量进行寻址) 如果整条作用域链都没有对应变量的声明;则会在全局自动声明一份 /* var a = 3; b = a;*/ console.log(b) //全局自动声明一份,3 右查询(对等号非左边的变量进行寻址) 如果整条作用域链都没有对应变量的声明;则会报错 console.log(c) 2、作用域变量的查找!!!走作用域链!!! var x = 10; function fn() { console.log(x); } f

this指向问题

cjmxcc — Tue, 12 Jan 2021 19:49:59 +0800

1，在回调函数中回调函数定义：自己定义的、自己没调用、最终执行了。 2、api的学习方法关注这个api是用来干嘛的语法; 搞清楚这个api的每一个参数搞清楚这个api的返回值 setTimeout(function(a,b,c){ console.log(a,b,c) },1000,1,2,3) function setTimeout(fn,time) { fn() } 2，隐式丢失怎么防止隐式丢失，bind()方法主要就是将函数绑定到某个对象， bi

元素或者鼠标在页面，视口，屏幕，元素中的位置。元素和视口的宽度和高度，页面中内容向上滚动的距离。

cjmxcc — Thu, 05 Nov 2020 20:12:45 +0800

DOM容易模糊的获取位置，宽度高度的属性元素或者鼠标在页面，视口，屏幕，元素中的位置。元素和视口的宽度和高度，页面中内容向上滚动的距离。 DOM 操作 - 获取元素的尺寸 offsetWidth / offsetHeight 内容+内边距+边框 clientWidth / clientHeight 内容+内边距 scrollWidth / scrollHeight 内容溢出，考虑溢出内容的宽度；如果内容不溢出同 client 系列一致。 getBoundingClientRect() 返回对象，

JavaScript闭包面试题详解

cjmxcc — Thu, 05 Nov 2020 18:12:47 +0800

说说它们的输出情况第一题 var name = "The Window"; var object = { name: "My Object", getNameFunc: function () { return function () { return this.name; }; } }; console.log(object.getNameFunc()()); // The window // var f = obje

JS实现抽奖活动程序

cjmxcc — Mon, 26 Oct 2020 20:47:31 +0800

本小程序涉及JS知识点定时器，回调函数，onclick点击事件绑定元素，选择器方式获取元素… Document</title& </article> <article> <h1>JS对象，原型链，构造函数面试题</h1> <p>cjmxcc — Mon, 26 Oct 2020 16:35:51 +0800</p> 1，下面两次num输出的值是多少？ <script> var num = 50; function f1(num) { num = 60; // 修改形参 num = 60 console.log(num); // 60 } f1(num); console.log(num); // 50 </script> 60,50 2，下面nu </article> <article> <h1>JS实现倒计时</h1> <p>cjmxcc — Mon, 26 Oct 2020 13:34:37 +0800</p> JS实现倒计时实现思路 1，通过内置时间函数实例化日期对象获取当前时间now 2，设置一个结束时间戳 end 3，求时间差end-now的毫秒数，分别取出天，小时，分钟，秒。 4，例如定时器和回调函数组合，动态更新时间，展示到页面。代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wid </article> <article> <h1>JS实现电子时钟</h1> <p>cjmxcc — Mon, 26 Oct 2020 13:24:00 +0800</p> JS实现电子时钟本案例设及的JS知识点时间函数，定时器，内置构造函数实例化对象的创建，字符串拼接，流程控制以及三元运算符，回调函数。实现代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> < </article> <article> <h1>JavaScript数据类型转换的规则</h1> <p>cjmxcc — Tue, 13 Oct 2020 19:51:05 +0800</p> 一、数据类型转换的规则 1.1其它类型转为number 1.string->number 纯数字字符串->对应的数字空字符串，纯空格字符串->0 其它->nan 2.boolean-> number true->1 false->0 3.null->0 4.undefined->nan 1.2其它类型转为string 1.number->string 数字会作为字符串内容 2.boolearn->string true->'true </article> <article> <h1>前端必考经典，块级，行内块，行内元素在父元素中如何设置水平居中和水平垂直居中</h1> <p>cjmxcc — Sun, 27 Sep 2020 20:46:13 +0800</p> 一、如何让元素在父元素中水平垂直居中 1.1行内块或者行内元素在父元素中居中： text-align:center; line-height:与高度一致; 行内块元素还需在自身设置： vertical-align:middle; 1.2块级元素 1.2.1水平居中给元素本身设置： margin-left:auto; margin-left:auto; 水平垂直都居中方案一：给块级元素本身设置： position:absolute; left:50%; top:50%; margin-left: </article> <article> <h1>盒子显示模式和可见性，CSS 属性的继承。</h1> <p>cjmxcc — Tue, 22 Sep 2020 19:28:29 +0800</p> 一，三大类选择器 1.1基本选择器标签名选择器类名选择器 ID选择器全局选择器 * 1.2组合选择器 ① 后代选择器 selector1 selector2 ② 子元素选择器 selector1>selector2 ③ 并集选择器 selector1,selector2 ④ 交集选择器 selector1selector2 1.3伪类选择器 :link 超链接未访问的状态 :visited 超链接已访问的状态 :hover 鼠标悬停在元素上 :active 鼠标在元素上，按键按下去二、盒子显 </article> </main></body></html>