JS基础
文章平均质量分 67
__Zoe__
Time will tell.
展开
-
JavaScript之字符串常用方法
JavaScript之字符串常用方法原创 2022-07-04 19:21:05 · 648 阅读 · 0 评论 -
IE Button按钮下 a标签href失效
解决方案:1、在button上加onclick事件<Button type="primary" onClick={() => window.open(`${PUBLIC_PATH}g/activity/create`, '_self')}> 创建新活动</Button>2、a标签样式写成button的样式原创 2021-04-14 18:22:15 · 289 阅读 · 0 评论 -
JavaScript常见的操作数组的函数方法
函数作用join()将数组中所有元素都转化为字符串连接在一起sort()将数组中的元素排序(会改变原数组)reverse()将数组中的元素颠倒顺序(会改变原数组)concat()将多个数组或数连接起来,组成一个新的数组slice()返回指定数组的一个片段或子数组splice()在数组指定位置插入或删除元素(会改变原数组)push()在数组的尾部添加一个或多个元素(会改变原数组)pop()删除数组的最后一个元素,并返回该元素(会改变...转载 2020-11-18 22:32:18 · 500 阅读 · 3 评论 -
js 将字符串中的大写变成小写,小写变成大写
/** * js 将字符串反转 */function strReverse(str) { var tmp = str.split(''); return (tmp.reverse()).join('');}console.log(strReverse('abcdef'))/** * js 将字符串中的大写变成小写,小写变成大写 */function strChange(arg) { var str=arg.split(''); for(var i = 0;原创 2020-11-16 22:57:35 · 6928 阅读 · 0 评论 -
js 面试题(递归思路)
题目:定义一个多层嵌套的对象 {a:{b:{c:1}}},写一个函数,如果传入 ‘a,b,c’ 则返回true,否则返回false/** * {a:{b:{c:1}}} * 如果传入a,b,c 返回true 否则false */function validate(str) { let obj = {a:{b:{c:1}}}; let arr = str.split(','); const valid = (i, newObj) => { if (i =原创 2020-11-15 21:43:51 · 956 阅读 · 0 评论 -
js实现等差数列,杨辉三角,斐波那契数列,九九乘法表
/** * 等差数列 */function print1(start, value, endKey) { let arr = []; for (let i = 0; i < endKey; i++) { arr.push(start + (i * value)); } console.log(arr);}print1(1, 2, 10);/** * 杨辉三角 * 需求:打印到第n行 */function repeat2(m, n)原创 2020-11-11 22:40:26 · 1407 阅读 · 0 评论 -
JavaScript增加节点和删除DOM节点
效果图(点新增,input框增加):html代码:<div class="content" id="factoryName" style="width:35%"> <div style="width:100%;display: inline-block; margin-right: 30px;"> <input style="width: 80%;margin-bottom: 10px;margin-right: 10px;" class="num_test r原创 2020-10-21 22:20:45 · 161 阅读 · 0 评论 -
鼠标事件 onmouseover、onmouseenter、onmouseleave和onmouseout
触发时机:onmouseout:鼠标滑出onmouseover:鼠标滑过(在表面经过即可)onmouseenter:鼠标进入(进入到里面)onmouseleave:鼠标离开onmouseover 和 onmouseenter 的区别:onmouseover 和 onmouseout 存在冒泡机制onmouseenter 和 onmouseleave 不存在1、打开页面时,鼠标刚好在这个元素上,会触发 onmouseover,不会触发 onmouseenter2、onmouseover原创 2020-10-14 18:31:47 · 3741 阅读 · 2 评论 -
创建10个a标签 点击弹出对应序号
错误写法:var i, afor (i = 0; i< 10; i++) { a = document.createElement('a'); a.innerHTML = i + "<br>"; a.addEventListener("click", function(e) { e.preventDefault(); alert(i); }) documen...原创 2020-02-26 20:26:26 · 381 阅读 · 0 评论 -
JS基础知识 - 单线程、异步和同步
1、异步与同步的区别基于 JS 单线程的机制异步不会阻塞代码执行同步会阻塞代码执行2、异步的应用场景网络请求:如 ajax、图片加载定时任务:setTimeout、setInterval3、理解ES6的 Promise,解决的是 callback hell(回调地狱)的问题4、手写 Promise 加载一张图片function loadImg(src) { const ...原创 2019-12-10 10:58:51 · 128 阅读 · 0 评论 -
JS基础知识 - 作用域、自由变量、闭包和 this 的使用
1、作用域作用域分为:全局作用域、函数作用域、块级作用域2、自由变量一个变量在当前作用域没有定义,但被使用了向上级作用域,一层一层依次寻找,知道找到为止如果到全局作用域都没找到,则报错 XX is not defined3、闭包闭包其实是作用域应用的特殊情况,有两种表现:函数作为参数被传递函数作为返回值被返回// 函数作为返回值function create() {...原创 2019-12-03 11:02:39 · 196 阅读 · 0 评论 -
JS基础知识 - 手写简易jQuery 考虑插件和扩展性
代码如下:class JQuery { constructor(selector) { const result = document.querySelectorAll(selector); const length = result.length; for(let i = 0; i < length; i++) { this[i] = result[i]; } ...原创 2019-11-29 17:52:13 · 210 阅读 · 0 评论 -
JS基础知识 - 继承、原型与原型链的理解
class下面举例说明(Student、Teacher 继承People类):class People { // 构造函数 constructor(name) { this.name = name; } eat = () => { console.log( `${this.name} eat something` ) }}class Student ...原创 2019-11-29 11:05:50 · 162 阅读 · 0 评论 -
JS基础知识 - JS 值类型和引用类型的区别
javascript中变量类型分为值类型(基本数据类型)和引用类型(1) 值类型:String(字符串),Number(数值),Boolean(布尔值),Undefined,Null(2) 引用类型:Array(数组),Object(对象),Function(函数)值类型和引用类型的区别(1) 存储位置不一样① 值类型的变量会保存在栈内存中,如果在一个函数中声明一个值类型的变量,...转载 2019-11-28 14:27:54 · 184 阅读 · 1 评论 -
JS基础知识 - JS 类型转换的情况
什么情况下会出现类型转换?1、字符串拼接2、== 判断3、if 语句和逻辑运算1、== 与 === 分别在什么情况下使用?// 什么情况下用 == 或者 ===// 除了 == null 之外,其他的一律用 ===const obj = {x: 20};if (obj.x == null) {}// 相当于:// if(obj.x === null || obj.x ===...原创 2019-11-28 10:52:11 · 154 阅读 · 1 评论 -
JS基础知识 - 引用类型实现深拷贝的代码
首先,简单赋值:const obj1 = { age: 22, name: 'xxx', address: { city: 'beijing', }, arr: [1,2,3,4],}const obj2 = obj1;obj2.arr[0] = 11;console.log(obj1);结果展示:深拷贝的实现:const obj1 = { age: 22,...原创 2019-11-27 18:25:45 · 89 阅读 · 0 评论 -
JS基础知识 - JS数据类型以及typeof判断的类型
JS 数据类型:基本数据类型:Number,String,Boolean,Undefined,Null复杂(引用)数据类型:Object,Array,Function,date,RegExptypeof 检验返回的数据类型有:function:Function 函数类型boolean:Boolean 布尔值string:String 字符串number:Number 数字un...原创 2019-11-27 11:07:54 · 228 阅读 · 0 评论 -
Web Storage
Web Storage 是HTML5中新增的除 Canvas 元素以外,非常非常重要的功能!没有之一!顾名思义,其就是在Web端存储数据的功能,当然这里的存储只是针对客户端本地而言的。Web Storage的优缺点:优点:存储空间更大。在IE下每个独立存储空间为10M,其它浏览器存储空间略有不同,但可以肯定的是至少要比 cookie 要大很多。存储内容不会与服务器发生任何交互,数据仅仅...转载 2019-10-31 17:09:58 · 138 阅读 · 0 评论 -
JS中this的四种用法
一、一般函数调用以下代码,属于全局性调用,this代表全局对象。var a = 1;function foo() { console.log(this.a);}foo(); // 1二、作为对象方法调用以下代码,this指向上层对象即obj。function foo() { console.log(this.x);}var obj = {};obj.x = 1;ob...原创 2019-05-30 14:51:14 · 313 阅读 · 0 评论 -
for循环的运行顺序
for循环的例子:for(i = 0; i < 5; i++) { console.log(i) // 依次输出 0 1 2 3 4}console.log(i) //输出 5第一次执行for循环:先执行i=0; 再进行判断i<5;如果成立执行for循环体里的表达式,然后i++;第二次及后续执行:执行判断i<5; 如果成立执行for循环体里的表达式,然后i...原创 2019-05-30 15:21:38 · 2925 阅读 · 0 评论 -
JavaScript中的call、apply、bind的区别
call()、apply()、bind()都是改变函数中this指向的方法。call() 、apply()可以看作是某个对象的方法,通过调用方法的形式来间接调用函数。bind() 就是将某个函数绑定到某个对象上。1、call()第一个参数是指定的对象;后续的所有参数都是传入函数的值var obj = {};function foo(a, b, c) { console.log(th...原创 2019-05-30 18:20:34 · 74 阅读 · 0 评论 -
e.stopPropagation、e.preventDefault的用法与区别
1、e.stopPropagation()阻止任何父事件被执行<div>this is a div element;<p>this is a p element;<span>this is a span element;</span></p></div><script>$("span").c...原创 2019-06-10 11:17:34 · 642 阅读 · 0 评论 -
JQuery 获取元素宽度和高度
获取浏览器窗口的高度和宽度:$(document).width()~ $(document).height()width():返回元素的宽度height():返回元素的高度innerWidth():返回元素的宽度(含内边距 padding)innerHeight():返回元素的高度(含内边距 padding)outerWidth():返回元素的宽度(含内边距 padding + 边...原创 2019-06-20 11:26:36 · 10220 阅读 · 2 评论 -
JS中filter、find、has的用法
1、filter()含义:匹配当前的元素集合,删除不符合条件的元素,返回新的集合参数:字符串值,包含供匹配当前元素集合的选择器表达式(过滤条件)返回:新的集合作用于当前元素。<ul> <li class='a'>list item 1</li> <li>list item 2</li> <li class='a...原创 2019-06-04 19:08:00 · 16139 阅读 · 0 评论 -
JQuery效果-淡入淡出和滑动
1、 toggle(); 用来切换 hide() 和 show() 方法。显示被隐藏的元素,并隐藏已显示的元素。语法:$(selector).toggle(speed, callback);speed:规定隐藏和显示的速度;callback:toggle执行完成之后回调的函数名称。2、$(selector).fadeIn(speed, callback); 用来淡入已隐藏的元素。3、$...原创 2019-06-17 10:38:30 · 286 阅读 · 0 评论 -
深拷贝与浅拷贝
如果区分深浅复制???假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,如果B没变,那就是深拷贝。浅复制例子:面试常问,基本数据类型有哪些,number,string,boolean,null,undefined,symbol以及未来ES10新增的BigInt(任意精度整数)七类。引用数据类型(Object类)有常规名值对的无序对象{a:1},数组[1,2...转载 2019-09-06 17:22:28 · 92 阅读 · 0 评论 -
构造函数
专门用来创建对象的函数,和 new 关键字一起使用构造函数的执行配合 new 关键字来调用调用构造函数的时候,系统自动创建一个新对象,并且把这个对象赋值给了构造函数中的 this 关键字构造函数中,使用 this 关键字操作新对象构造函数默认返回新对象返回值默认返回构造函数中的 this如果写返回值 1. 简单类型:还是返回 this,相当于不起作用 2....原创 2019-06-29 17:15:57 · 61 阅读 · 0 评论 -
JavaScript基础知识
1、什么是 AJAX?是一种可以在无需加载整个网页的情况下,能够更新部分网页的一种技术。2、同步和异步?**同步:**当客户端发起一个请求,服务器进行处理然后响应,在这个过程中页面完全处于等待状态。当服务器响应完成,页面会重新载入,这个时候如果出现错误,需要重新发起请求。**异步:**当客户端发起一个请求,服务器端进行处理然后响应,在这个过程中客户端依然可以操作其他内容,客户端和服务器端互...原创 2019-06-26 19:38:08 · 73 阅读 · 0 评论 -
js函数的隐式参数 arguments 和 this
在函数调用时,arguments和this会被静默的传递给函数,并可以在函数体内引用它们,借以访问函数相关的一些信息。其中arguments是一个类数组结构(object),它保存了调用时传递给函数的所有实参;this是函数执行时的上下文对象, 这个对象有些让人感到困惑的行为。 下面分别对他们进行讨论。1. arguments1.1 背景JavaScript 允许函数在调用时传入的实参个数...转载 2019-07-15 18:29:03 · 558 阅读 · 0 评论 -
js函数中的形参和实参
参数有形参(parameter)和实参(argument)之分;形参相当于函数中定义的变量;实参是在运行时的函数调用时传入的参数。举例说明:function fun(a) { console.log(a);}fun(2);声明函数fun时,a 就是形参。调用函数 fun(2) 时,2 就是实参...原创 2019-07-15 18:33:02 · 713 阅读 · 0 评论 -
前端常用的设计模式
什么是设计模式?设计模式(Design Pattern)是一套被反复使用、多数人知晓的、经过分类的、代码设计经验的总结。针对特定问题制定的简洁而优雅的解决方案。单例模式、观察者模式、工厂模式、命令模式、职责链模式1、单例模式定义:保证一个类只有一个实力,并且提供一个访问它的全局访问点。需求:一些对象我们往往只需要一个,比如线程池、全局缓存、浏览器中的window对象、登录浮窗等。实...转载 2019-07-15 19:02:08 · 101 阅读 · 0 评论 -
for...in、for...of、forEach的比较
以数组为例,JavaScript 提供了多种遍历语法。最原始的写法是 for 循环。for (var index = 0; index < myArray.length; index++) { console.log(myArray[index])}这种写法比较麻烦,因此数组提供了内置的 forEach 方法。myArray.forEach(function (value) {...原创 2019-07-17 12:24:13 · 58 阅读 · 0 评论 -
for循环和label语句
使用 label 语句可以在代码中添加标签,以便将来使用。label 语句与 break 和 continue 语句联合使用。在下面这个例子中,outermost 标签表示外部的 for 语句。内部循环中的 break 语句带了一个参数:要返回到标签。添加这个标签的结果将导致 break 语句不仅会退出内部的 for 语句(即使用变量 j 的循环),而且也会退出外部的 for 语句(即使用变...原创 2019-07-25 19:02:30 · 1441 阅读 · 0 评论 -
js截取字符串 slice()、substr() 和 substring()
ECMAScript 提供了三个基于字符串创建新字符串的方法:slice()、substr() 和 substring()三个方法会返回被操作字符串的一个子字符串,而且也都接受一或两个参数。第一个参数指定字符串的开始位置,第二个参数(在指定的情况下)表示子字符串到哪里结束。具体来说,slice() 和 substring() 的第二个参数指定的是子字符串最后一个字符后面的位置。而 subs...原创 2019-08-07 17:36:54 · 113 阅读 · 0 评论 -
this指针的原理
this 指向函数运行时所在的环境原创 2019-05-30 11:15:03 · 149 阅读 · 0 评论