js基础---前端常用正则表达式
摘要：在表单验证中，使用正则表达式来验证正确与否是一个很频繁的操作，本文收集整理了15个常用的javaScript正则表达式，其中包括用户名、密码强度、整数、数字、电子邮件地址（Email）、手机号码、身份证号、URL地址、 IPv4地址、 十六进制颜色、 日期、 QQ号码、 微信号、车牌号、中文正则。
阅读全文
摘要：- 正则用来定义一些字符串的规则，程序可以根据这些规则来判断一个字符串是否符合规则， 也可以将一个字符串中符合规则的内容提取出来。 - 创建正则表达式 - var reg = new RegExp("正则","匹配模式"); - var reg = /正则表达式/匹配模式 - 语法： 匹配模式： i
阅读全文
摘要：* charAt() * - 可以返回字符串中指定位置的字符 * - 根据索引获取指定的字符 * concat() * - 可以用来连接两个或多个字符串 * - 作用和+一样 * indexof() * - 该方法可以检索一个字符串中是否含有指定内容 * - 如果字符串中含有该内容，则会返回其第一次
阅读全文
摘要：* Math.random() * - 可以用来生成一个0-1之间的随机数 * - 生成一个0-10的随机数 * - 生成一个0-x之间的随机数 * Math.round(Math.random()*x) * * - 生成一个1-10 * - 生成一个x-y之间的随机数 * Math.round(M
阅读全文
摘要：/* * Date对象 * - 在JS中使用Date对象来表示一个时间 */ //创建一个Date对象 //如果直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间 var d = new Date(); //创建一个指定的时间对象 //需要在构造函数中传递一个表示时间的字符串作为参数
阅读全文
摘要：- arguments - arguments和this类似，都是函数中的隐含的参数 - arguments是一个类数组元素，它用来封装函数执行过程中的实参 所以即使不定义形参，也可以通过arguments来使用实参 - arguments中有一个属性callee表示当前执行的函数对象 /* * 在
阅读全文
摘要：- call() - apply() - 这两个方法都是函数对象的方法需要通过函数对象来调用 - 通过两个方法可以直接调用函数，并且可以通过第一个实参来指定函数中this - 不同的是call是直接传递函数的实参而apply需要将实参封装到一个数组中传递 function fun(a,b) { co
阅读全文
摘要：var numArr = [3, 4, 1, 2, 1, 1, 3, 2, 4, 3, 4]; for (var i = 0; i < numArr.length; i++) { for (var j = i + 1; j < numArr.length; j++) { if(numArr[i] =
阅读全文
摘要：var arr = ["孙悟空","猪八戒","沙和尚"]; var arr2 = ["白骨精","玉兔精","蜘蛛精"]; var arr3 = ["二郎神","太上老君","玉皇大帝"]; /* * concat()可以连接两个或多个数组，并将新的数组返回 * - 该方法不会对原数组产生影响 *
阅读全文
摘要：//创建一个数组 var arr = ["孙悟空","猪八戒","沙和尚","唐僧","白骨精"]; /* * forEach()方法需要一个函数作为参数 * - 像这种函数，由我们创建但是不由我们调用的，我们称为回调函数 * - 数组中有几个元素函数就会执行几次，每次执行时，浏览器会将遍历到的元素
阅读全文
摘要：数组（Array） - 数组也是一个对象，是一个用来存储数据的对象 和Object类似，但是它的存储效率比普通对象要高 - 数组中保存的内容我们称为元素 - 数组使用索引（index）来操作元素 - 索引指由0开始的整数 - 数组的操作： - 创建数组 - var arr = new Array()
阅读全文
摘要：/* * 垃圾回收（GC） * - 就像人生活的时间长了会产生垃圾一样，程序运行过程中也会产生垃圾 * 这些垃圾积攒过多以后，会导致程序运行的速度过慢， * 所以我们需要一个垃圾回收的机制，来处理程序运行过程中产生垃圾 * - 当一个对象没有任何的变量或属性对它进行引用，此时我们将永远无法操作该对象
阅读全文
摘要：//当我们直接在页面中打印一个对象时，事件上是输出的对象的toString()方法的返回值 //如果我们希望在输出对象时不输出[object Object]，可以为原形添加一个toString()方法 Person.prototype.toString = function(){ return "P
阅读全文
摘要：使用in检查对象中是否含有某个属性时，如果对象中没有但是原型中有，也会返回true console.log("name" in mc); 可以使用对象的hasOwnProperty()来检查对象自身中是否含有该属性 使用该方法只有当对象自身中含有属性时，才会返回true console.log(mc
阅读全文
摘要：* 原型 prototype * * 我们所创建的每一个函数，解析器都会向函数中添加一个属性prototype * 这个属性对应着一个对象，这个对象就是我们所谓的原型对象 * 如果函数作为普通函数调用prototype没有任何作用 * 当函数以构造函数的形式调用时，它所创建的对象中都会有一个隐含的属
阅读全文
摘要：创建一个构造函数，专门用来创建Person对象的 构造函数就是一个普通的函数，创建方式和普通函数没有区别, 不同的是构造函数习惯上首字母大写 构造函数和普通函数的区别就是调用方式的不同 普通函数是直接调用，而构造函数需要使用new关键字来调用 构造函数的执行流程： 1.立刻创建一个新的对象 2.将新
阅读全文
摘要：使用instanceof可以检查一个对象是否是一个类的实例 语法： 对象 instanceof 构造函数 如果是，则返回true，否则返回false function Gz(name,age){ this.name = name; this.age = age; this.sayName = fun
阅读全文
摘要：this（上下文对象） - 我们每次调用函数时，解析器都会将一个上下文对象作为隐含的参数传递进函数。 使用this来引用上下文对象，根据函数的调用形式不同，this的值也不同。 - this的不同的情况： 1.以函数的形式调用时，this是window 2.以方法的形式调用时，this就是调用方法的
阅读全文
摘要：作用域 - 作用域简单来说就是一个变量的作用范围。 - 在JS中作用域分成两种： 1.全局作用域 - 直接在script标签中编写的代码都运行在全局作用域中 - 全局作用域在打开页面时创建，在页面关闭时销毁。 - 全局作用域中有一个全局对象window，window对象由浏览器提供， 可以在页面中直
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var obj = { name:"孙悟空", age:18, gender:"男", addre
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 创建一个对象 */ var obj = new Object(); //向对象中添加属性
阅读全文
摘要：//函数对象() /* * 立即执行函数 * 函数定义完，立即被调用，这种函数叫做立即执行函数 * 立即执行函数往往只会执行一次 */ /*(function(){ alert("我是一个匿名函数~~~"); })();*/ (function(a,b){ console.log("a = "+a)
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* * 创建一个函数，用来计算三个数的和 * * 可以使用 return 来设置函数的返回值
阅读全文
摘要：- 形参和实参 - 形参：形式参数 - 定义函数时，可以在()中定义一个或多个形参，形参之间使用,隔开 定义形参就相当于在函数内声明了对应的变量但是并不赋值， 形参会在调用时才赋值。 - 实参：实际参数 - 调用函数时，可以在()传递实参，传递的实参会赋值给对应的形参, 调用函数时JS解析器不会检查
阅读全文
摘要：- 函数也是一个对象，也具有普通对象的功能 - 函数中可以封装一些代码，在需要的时候可以去调用函数来执行这些代码 - 使用typeof检查一个函数时会返回function - 创建函数 - 函数声明 function 函数名([形参1,形参2...形参N]){ 语句... } - 函数表达式 var
阅读全文
摘要：- 使用对象字面量，在创建对象时直接向对象中添加属性 语法： var obj = { 属性名:属性值, 属性名:属性值, 属性名:属性值, 属性名:属性值 } <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <
阅读全文
摘要：- 基本数据类型和引用数据类型 - 基本数据类型 String Number Boolean Null Undefined - 引用数据类型 Object - 基本数据类型的数据，变量是直接保存的它的值。 变量与变量之间是互相独立的，修改一个变量不会影响其他的变量。 - 引用数据类型的数据，变量是保
阅读全文
摘要：- 使用in检查对象中是否含有指定属性 - 语法："属性名" in 对象 - 如果在对象中含有该属性，则返回true 如果没有则返回false
阅读全文
摘要：1.对象（Object） - 对象是JS中的引用数据类型 - 对象是一种复合数据类型，在对象中可以保存多个不同数据类型的属性 - 使用typeof检查一个对象时，会返回object - 创建对象 - 方式一： - var obj = new Object(); - 方式二： - var obj =
阅读全文
摘要：* JS中数据类型 * - String 字符串 * - Number 数值 * - Boolean 布尔值 * - Null 空值 * - Undefined 未定义 * - 以上这五种类型属于基本数据类型，以后我们看到的值 * 只要不是上边的5种，全都是对象 * - Object 对象 * *
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * break关键字可以用来退出switch或循环语句 * 不能在if语句中使用break和
阅读全文
摘要：for (var i = 1; i <= 9; i++) { for (var j = 1; j <= i; j++) { document.write(i+"*"+j+"="+(i*j)+"\t"); } document.write("<br>"); }
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* 通过程序，在页面中输出如下的图形： * 1 <1 i=0 ** 2 <2 i=1 ***
阅读全文
摘要：- for循环 - 语法： for(①初始化表达式 ; ②条件表达式 ; ④更新表达式){ ③语句... } - 执行流程： 首先执行①初始化表达式，初始化一个变量， 然后对②条件表达式进行求值判断，如果为false则终止循环 如果判断结果为true，则执行③循环体 循环体执行完毕，执行④更新表达式
阅读全文
摘要：- 通过循环语句可以反复执行某些语句多次 - while循环 - 语法： while(条件表达式){ 语句... } - 执行流程： while语句在执行时，会先对条件表达式进行求值判断， 如果判断结果为false，则终止循环 如果判断结果为true，则执行循环体 循环体执行完毕，继续对条件表达式进
阅读全文
摘要：1.条件分支语句 - switch语句 - 语法: switch(条件表达式){ case 表达式: 语句... break; case 表达式: 语句... break; case 表达式: 语句... break; default: 语句... break; } - 执行流程： - switch
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script type="text/javascript"> alert("请输入期末成绩"); // 获取用户的输入 var n
阅读全文
摘要：条件判断语句 - 条件判断语句也称为if语句 - 语法一： if(条件表达式){ 语句... } - 执行流程： if语句执行时，会先对条件表达式进行求值判断， 如果值为true，则执行if后的语句 如果值为false，则不执行 - 语法二： if(条件表达式){ 语句... }else{ 语句..
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 我们的程序是由一条一条语句构成的 * 语句是按照自上向下的顺序一条一条执行的 * 在JS
阅读全文
摘要：优先级： - 和数学中一样，JS中的运算符也是具有优先级的， 比如 先乘除 后加减 先与 后或 - 具体的优先级可以参考优先级的表格，在表格中越靠上的优先级越高， 优先级越高的越优先计算，优先级相同的，从左往右计算。 - 优先级不需要记忆，如果越到拿不准的，使用()来改变优先级。 <!DOCTYPE
阅读全文
摘要：三元运算符： ?: - 语法：条件表达式?语句1:语句2; - 执行流程： 先对条件表达式求值判断， 如果判断结果为true，则执行语句1，并返回执行结果 如果判断结果为false，则执行语句2，并返回执行结果 <!DOCTYPE html> <html> <head> <meta charset=
阅读全文
摘要：相等运算符 == - 相等，判断左右两个值是否相等，如果相等返回true，如果不等返回false - 相等会自动对两个值进行类型转换，如果对不同的类型进行比较，会将其转换为相同的类型然后再比较， 转换后相等它也会返回true != - 不等，判断左右两个值是否不等，如果不等则返回true，如果相等则
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 在字符串中使用转义字符输入Unicode编码 * \u四位编码 */ console.l
阅读全文
摘要：关系运算符 - 关系运算符用来比较两个值之间的大小关系的 > >= < <= - 关系运算符的规则和数学中一致，用来比较两个值之间的关系， 如果关系成立则返回true，关系不成立则返回false。 - 如果比较的两个值是非数值，会将其转换为Number然后再比较。 - 如果比较的两个值都是字符串，此
阅读全文
摘要：赋值运算符 = - 可以将符号右侧的值赋值给左侧变量 += - a += 5 相当于 a = a+5 - var str = "hello"; str += "world"; -= - a -= 5 相当于 a = a-5 *= - a *= 5 相当于 a = a*5 /= - a /= 5 相当
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * && || 非布尔值的情况 * - 对于非布尔值进行与或运算时， * 会先将其转换为布尔
阅读全文
摘要：逻辑运算符 ! - 非运算可以对一个布尔值进行取反，true变false false边true - 当对非布尔值使用!时，会先将其转换为布尔值然后再取反 - 我们可以利用!来将其他的数据类型转换为布尔值 && - &&可以对符号两侧的值进行与运算 - 只有两端的值都为true时，才会返回true。只
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 自增 ++ * - 通过自增可以使变量在自身的基础上增加1 * - 对于一个变量自增以后
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 一元运算符，只需要一个操作数 * + 正号 * - 正号不会对数字产生任何影响 * -
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 运算符也叫操作符 * 通过运算符可以对一个或多个值进行运算,并获取运算结果 * 比如：t
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 将其他的数据类型转换为Boolean * - 使用Boolean()函数 * - 数字
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var a = 123; /* * 在js中，如果需要表示16进制的数字，则需要以0x开头 * 如
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 将其他的数据类型转换为Number * 转换方式一： * 使用Number()函数 *
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 强制类型转换 * - 指将一个数据类型强制转换为其他的数据类型 * - 类型转换主要指，
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * Null（空值）类型的值只有一个，就是null * null这个值专门用来表示一个为空的
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * Boolean 布尔值 * 布尔值只有两个，主要用来做逻辑判断 * true * - 表
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 在JS中所有的数值都是Number类型， * 包括整数和浮点数（小数） * * JS中可
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* * 数据类型指的就是字面量的类型 * 在JS中一共有六种数据类型 * String 字符
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 标识符 * - 在JS中所有的可以由我们自主命名的都可以称为是标识符 * - 例如：变量
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 字面量，都是一些不可改变的值 * 比如 ：1 2 3 4 5 * 字面量都是可以直接使用
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* 多行注释 JS注释 多行注释，注释中的内容不会被执行，但是可以在源代码中查看 要养成良好的编
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <!-- 可以将js代码编写到外部js文件中，然后通过script标签引入 写到外部文件中可以在不同的页面中同时引用，也可以利用到浏览器的缓存机制 推荐使用的方式
阅读全文
摘要：<!--JS代码需要编写到script标签中--> <script type="text/javascript"> /* * 控制浏览器弹出一个警告框 * alert("Hello World"); */ /* * 让计算机在页面中输出一个内容 * document.write()可以向body中输
阅读全文
摘要：网页中字体大小最小是12px，不能设置一个比12像素还小的字体 如果我们设置了一个小于12px的字体，则字体自动设置为12 0.1333333vw = 1px 5.3333vw = 40px rem就是通过html中的 font-size的大小来决定的 代码: // psd设计图的像素宽度 @sj-
阅读全文
摘要：不同的设备完美视口的大小是不一样的 iphone6 -- 375 iphone6plus -- 414 由于不同设备视口和像素比不同，所以同样的375个像素在不同的设备下意义是不一样， 比如在iphone6中 375就是全屏，而到了plus中375就会缺一块 所以在移动端开发时，就不能再使用px来进
阅读全文
