![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
文章平均质量分 93
JavaScript 是 Web 的编程语言
Jay·Yuen
干饭人·
展开
-
2023年前端面试知识点总结(JavaScript篇)
JS是一种具有函数优先特性的轻量级、解释型或者说即时编译型的编程语言。是一种基于原型、多范式、单线程的动态语言,并且支持面向对象、命令式和声明式(如函数式编程)风格。比较全面的一篇JS面试题原创 2023-02-18 14:52:05 · 898 阅读 · 0 评论 -
Javascript 高效开发工具函数
Javascript 高效开发工具函数数组multArray二维数组转换flatten扁平化数组flattenDeep指定层级扁平化数组isArrayEqual检查两个数组各项相等allEqual检查数组各项相等diffArray具有唯一array值的数组haveArr具有共同array值的数组uniqueArray数组去重uniqueArrayObject数组对象去重treeData生成树结构数据ascArr数组升序descArr数组降序shuffle随机排序takeArr原创 2021-04-01 18:05:40 · 783 阅读 · 0 评论 -
用 TypeScript 写 React & Redux - 完全指南
“这个指南是一个最新的摘要,记录了关于如何用TypeScript 以函数式风格使用React(以及相关生态)最重要的模式和示例。它会使你的代码在从具体实现中进行类型推导时绝对是类型安全的,这样就能减少来自过度类型声明的信息噪音,并更容易写出易于长期维护的正确类型声明。”目标完全的类型安全(支持--strict模式),并且在向应用的下游代码传递时,不会丢失类型信息(比如:缺少类型断言或用 any 来强行使用)使用高级 TypeScript 语言特性(诸如类型推论和控制流分析)来消除类型冗余、使类型.翻译 2020-09-06 13:54:58 · 4660 阅读 · 0 评论 -
Airbnb JavaScript 风格指南
Airbnb JavaScript 风格指南() {JavaScript最合理的方法 A mostly reasonable approach to JavaScript注意: 这个指南假定你正在使用Babel, 并且需要你使用或等效的使用babel-preset-airbnb。 同时假定你在你的应用里安装了带有或等效的airbnb-browser-shims的shims/polyfills目录TypesReferencesObjectsArraysDestructuringStr翻译 2020-08-04 19:54:33 · 5771 阅读 · 0 评论 -
28 - JavaScript 特效:scroll家族和缓动动画
缓动动画三个函数缓慢动画里,我们要用到三个函数,这里先列出来:Math.ceil() 向上取整Math.floor() 向下取整Math.round(); 四舍五入缓动动画的原理缓动动画的原理就是:在移动的过程中,步长越来越小。设置步长为**:目标位置和盒子当前位置的十分之一**。用公式表达,即: 盒子位置 = 盒子本身位置 + ...原创 2019-11-19 18:18:59 · 6540 阅读 · 0 评论 -
27 - JavaScript 特效:offset家族和匀速动画(含轮播图的实现)
前言JS动画的主要内容如下:1、三大家族和一个事件对象:三大家族:offset/scroll/client。也叫三大系列。事件对象/event(事件被触动时,鼠标和键盘的状态)(通过属性控制)。2、动画(闪现/匀速/缓动)3、冒泡/兼容/封装4、正则offset 家族的组成我们知道,三大家族包括:offset/scroll/client。今天来讲一下offset,以及...原创 2019-11-19 18:07:00 · 2998 阅读 · 0 评论 -
26 - JavaScript原型链
常见概念构造函数构造函数-扩展原型规则和示例原型链instanceof构造函数任何一个函数都可以被new,new了之后,就成了构造方法。如下: function Foo(name, age) { this.name = name; this.age = age; //retrun this; //默...原创 2019-11-19 18:03:09 · 3332 阅读 · 0 评论 -
25 - JavaScript BOM的常见内置方法和内置对象
BOM的介绍JavaScript的组成JavaScript基础分为三个部分:ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。DOM:文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。BOM:浏览器对象模型,操作浏览器部分功能的API。比如让浏览器自动滚动。什么是BOMBOM:Brows...原创 2019-11-19 17:58:04 · 2998 阅读 · 0 评论 -
24 - JavaScript 事件对象Event和冒泡
绑定事件的两种方式/DOM事件的级别DOM0的写法:onclick element.onclick = function () {}举例:<body> <button>点我</button> <script> var btn = document.getElementsByTagName("button")...原创 2019-11-13 16:56:27 · 4908 阅读 · 0 评论 -
23 - JavaScript 通过style对象设置行内样式
style属性的获取和修改在DOM当中,如果想设置样式,有两种形式:className(针对内嵌样式)style(针对行内样式)这篇文章,我们就来讲一下style。需要注意的是:style是一个对象,只能获取行内样式,不能获取内嵌的样式和外链的样式。例如:<!DOCTYPE html><html lang="en"> <head>...原创 2019-11-13 16:27:19 · 15290 阅读 · 1 评论 -
22- JavaScript DOM简介和DOM操作
常见概念JavaScript的组成JavaScript基础分为三个部分:ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。DOM:文档对象模型(Document object Model),操作网页上的元素的API。比如让盒子移动、变色、轮播图等。BOM:浏览器对象模型,操作浏览器部分功能的API。比如让浏览器自动滚...原创 2019-11-05 23:32:04 · 2826 阅读 · 0 评论 -
21- JavaScript 事件简介
事件简介事件:就是文档或浏览器窗口中发生的一些特定的交互瞬间。对于 Web 应用来说,有下面这些代表性的事件:点击某个元素、将鼠标移动至某个元素上方、关闭弹窗等等。JavaScript 是以事件驱动为核心的一门语言。JavaScript 与 HTML 之间的交互是通过事件实现的。事件的三要素事件的三要素:事件源、事件、事件驱动程序。比如,我用手去按开关,灯亮了。这件事情里,事件源是:手。...原创 2019-11-04 09:42:51 · 3624 阅读 · 2 评论 -
20- JavaScript 正则表达式
正则表达式简介定义:正则表达式用于定义一些字符串的规则。作用:计算机可以根据正则表达式,来检查一个字符串是否符合指定的规则;或者将字符串中符合规则的内容提取出来。如果你想查看正则更多的内容,可以查阅官方文档关于 RegExp 这个内置对象的用法。创建正则表达式的对象方式一:使用构造函数创建正则表达式的对象语法: let 变量 = new RegExp("正则表达式"); // 注意,...原创 2019-11-01 14:49:21 · 3617 阅读 · 0 评论 -
00 - JavaScript 简介
(一)前言 html/css/js:分别的作用 好看的皮囊千篇一律,有趣的灵魂万里挑一:内容、样式、动作 搞事情,简单认识js 事件,事件三要素:事件源、事件类型、事件处理(二)历史没有js 的功能实现,例:表单验证,用户体验不佳网景公司实现了javaScript,微软在IE 实现了Jscript在 Web 日益流行的同时,人们对客户端脚本语言的需求也越来越强...原创 2019-10-13 13:59:59 · 20548 阅读 · 6 评论 -
01-JavaScript变量
字面量:数字和字符串“字面量”即常量,是固定值,不可改变。看见什么,它就是什么。简单的字面量有2种:数字、字符串。(1)数值的字面量非常简单,写上去就行了,不需要任何的符号。例如:1 alert(886); //886是数字,所以不需要加引号。(2)字符串的字面量也很简单,但一定要加上引号。可以是单词、句子等。温馨提示:100是数字,"100"是字符串。总结字面量都可以直接使用...原创 2019-10-11 19:05:52 · 1842 阅读 · 3 评论 -
02-JavaScript变量的强制类型转换
前言强制类型转换:将一个数据类型强制转换为其他的数据类型。类型转换主要指,将其他的数据类型,转换为:String、Number、Boolean。你会把某个数据类型转换成 null或者 undefined吗?不会,因为这样做,没有意义。其他的简单类型 --> String方法一:变量+"" 或者 变量+"abc"举例如下:var a = 123; // Number 类型con...原创 2019-10-11 19:15:28 · 2144 阅读 · 2 评论 -
03- JavaScript 运算符
前言比如说+、- *、/ 都是运算符,而(3+5)/2则是表达式。运算符的定义和分类运算符也叫操作符。通过运算符可以对一个或多个值进行运算,并获取运算结果。比如:typeof就是运算符,可以来获得一个值的类型。它会将该值的类型以字符串的形式返回:number string boolean undefined object。注:运算符都是会返回结果的,而typeof这个运算符返回的结果就是...原创 2019-10-13 18:31:13 · 1803 阅读 · 0 评论 -
04- JavaScript 流程控制语句:选择结构(if和switch)
代码块用{}包围起来的代码,就是代码块。JS中的代码块,只具有分组的作用,没有其他的用途。代码块中的内容,在外部是完全可见的。举例: { var a = 2; alert("smyhvae"); console.log("永不止步"); } console.log("a = " + a);打印结果:(可以看出,虽然变量 a 是定义在代码块中...原创 2019-10-13 18:35:34 · 2224 阅读 · 0 评论 -
05- JavaScript 流程控制语句:循环结构(for和while)
前言循环语句:通过循环语句可以反复的执行一段代码多次。for循环for循环的语法语法: for(①初始化表达式; ②条件表达式; ④更新表达式){ ③语句... }执行流程: ①执行初始化表达式,初始化变量(初始化表达式只会执行一次) ②执行条件表达式,判断是否执行循环: 如果为true,则执行循环③ 如果为false,终止循环 ④执行更新表达式,更新表达式执...原创 2019-10-13 18:43:54 · 2192 阅读 · 2 评论 -
06- JavaScript 对象简介和对象的基本操作
面向对象简介对象的作用是:封装信息。比如Student类里可以封装学生的姓名、年龄、成绩等。对象具有特征(属性)和行为(方法)。面向对象:可以创建自定义的类型,很好的支持继承和多态。面向对象的特征:封装、继承、多态。对象简介基本数据类型和引用数据类型的对比基本数据类型(值类型):String 字符串、Number 数值、Boolean 布尔值、Null 空值、Undefined ...原创 2019-10-13 18:47:14 · 1634 阅读 · 3 评论 -
07- JavaScript 函数
函数的介绍函数:就是将一些功能或语句进行封装,在需要的时候,通过调用的形式,执行这些语句。函数也是一个对象使用typeof检查一个函数对象时,会返回function函数的作用:将大量重复的语句写在函数里,以后需要这些语句的时候,可以直接调用函数,避免重复劳动。简化编程,让编程模块化。来看个例子: console.log("你好"); sayHello();...原创 2019-10-16 09:25:41 · 2008 阅读 · 0 评论 -
08- JavaScript 作用域
作用域、变量提升的知识点,面试时会经常遇到。作用域(Scope)的概念作用域指一个变量的作用范围。在js中,一共有两种作用域:全局作用域函数作用域全局作用域直接编写在script标签中的JS代码,都在全局作用域。全局作用域在页面打开时创建,在页面关闭时销毁。在全局作用域中有一个全局对象window,它代表的是一个浏览器的窗口,它由浏览器创建我们可以直接使用。...原创 2019-10-16 09:29:22 · 1931 阅读 · 2 评论 -
09 - JavaScript的this问题
this解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的 上下文对象。根据函数的调用方式的不同,this会指向不同的对象:【重要】1.以函数的形式调用时,this永远都是window。比如fun();相当于window.fun();2.以方法的形式调用时,this是调用方法的那个对象3.以...原创 2019-10-21 16:01:27 · 3082 阅读 · 0 评论 -
10 - JavaScript对象的创建&构造函数
创建自定义对象的几种方法方式一:对象字面量对象的字面量就是一个{}。里面的属性和方法均是键值对。例如:var o = { name: "小米", age: 26, isBoy: true, sayHi: function() { console.log(this....原创 2019-10-21 16:08:28 · 2018 阅读 · 0 评论 -
11 - JavaScript原型对象
原型对象原型的引入 function Person(name, age, gender) { this.name = name; this.age = age; this.gender = gender; //向对象中添加一个方法 this.sayName = ...原创 2019-10-21 16:11:18 · 2459 阅读 · 0 评论 -
12 - JavaScript数组简介
之前学习的数据类型,只能存储一个值(字符串为一个值)。如果我们想存储多个值,就可以使用数组。数组简介数组(Array)是属于内置对象,我们可以在MDN网站上查询各种方法。数组和普通对象的功能类似,也是用来存储一些值的。不同的是:普通对象是使用字符串作为属性名的,而数组是使用数字来作为索引来操作元素。索引:从0开始的整数就是索引。数组的存储性能比普通对象要好。在实际开发中我们经常使...原创 2019-10-21 16:12:16 · 2794 阅读 · 0 评论 -
13 - JavaScript数组的四个基本方法&数组的遍历
前言数组的四个基本方法如下:方法描述备注push()向数组的最后面插入一个或多个元素,返回结果为该数组新的长度会改变原数组pop()删除数组中的最后一个元素,返回结果为被删除的元素会改变原数组unshift()在数组最前面插入一个或多个元素,返回结果为该数组新的长度会改变原数组shift()删除数组中的第一个元素,返回结果为被删除的元素会...原创 2019-10-21 16:19:07 · 7391 阅读 · 4 评论 -
14 - JavaScript数组的常见方法
前言数组的常见方法如下:方法描述备注slice()从数组中提取指定的一个或多个元素,返回结果为新的数组不会改变原数组splice()从数组中删除指定的一个或多个元素,返回结果为新的数组会改变原数组concat()连接两个或多个数组,返回结果为新的数组不会改变原数组join()将数组转换为字符串,返回结果为转换后的字符串不会改变原数组...原创 2019-10-21 16:21:08 · 1904 阅读 · 0 评论 -
15 - JavaScript数组的其他方法
前言数组的其他方法如下:方法描述备注indexOf(value)从前往后索引,获取 value 在数组中的第一个下标lastIndexOf(value)从后往前索引,获取 value 在数组中的最后一个下标find(function())找出第一个满足「指定条件返回true」的元素。findIndex(function())找出第一个满足「...原创 2019-10-21 16:28:54 · 2562 阅读 · 0 评论 -
JavaScript 十大排序算法
排序算法说明:(1)对于评述算法优劣术语的说明稳定:如果a原本在b前面,而a=b,排序之后a仍然在b的前面;不稳定:如果a原本在b的前面,而a=b,排序之后a可能会出现在b的后面;内排序:所有排序操作都在内存中完成;外排序:由于数据太大,因此把数据放在磁盘中,而排序通过磁盘和内存的数据传输才能进行;时间复杂度: 一个算法执行所耗费的时间。空间复杂度: 运行完一个程序所需内存的大小...转载 2019-10-23 11:12:12 · 2822 阅读 · 0 评论 -
16 - JavaScript内置对象:Date
内置对象简介内置对象就是指这个语言自带的一些对象,供开发者使用,这些对象提供了一些常用的或是最基本而必要的功能。JavaScript的内置对象:内置对象对象说明Arguments函数参数集合Array数组Boolean布尔对象Date日期时间Error异常对象Function函数构造器Math数学对象Number数...原创 2019-10-23 22:57:42 · 2094 阅读 · 0 评论 -
17 - JavaScript 内置对象:Math
内置对象 Math内置对象 Math 的常见方法方法描述备注Math.abs()返回绝对值Math.floor()向下取整(向小取)Math.ceil()向上取整(向大取)Math.round()四舍五入取整(正数四舍五入,负数五舍六入)Math.random()生成0-1之间的随机数不包含0和1Math.max(x, y...原创 2019-10-23 23:01:35 · 1976 阅读 · 0 评论 -
18 - JavaScript 包装类
包装类包装类的介绍我们都知道,js中的数据类型包括以下几种。基本数据类型:String、Number、Boolean、Null、Undefined引用数据类型:ObjectJS为我们提供了三个包装类:String():将基本数据类型字符串,转换为String对象。Number():将基本数据类型的数字,转换为Number对象。Boolean():将基本数据类...原创 2019-10-23 23:04:57 · 2351 阅读 · 0 评论 -
19 - JavaScript 内置对象:String
前言在日常开发中,String对象的使用频率是非常高的。所以有必要详细介绍。基本数据类型不能绑定属性和方法1、基本数据类型:注意,基本数据类型string是无法绑定属性和方法的。比如说: var str = "Yuan"; str.aaa = 12; console.log(typeof str); //打印结果为:string console.log...原创 2019-10-23 23:19:28 · 2273 阅读 · 0 评论