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