标签:理解 job bind 参数 特定 splice 实例 时间 独立
一、什么是Javascript
二、数据类型
1.简单数据类型:Number、String、Boolean、Undefined、Null
1 undefined表示一个声明了没有赋值的变量,变量只声明的时候值默认是undefined; 2 null表示一个空,变量的值如果想为null,必须手动设置;
2.复杂数据类型:Object
三、流程控制
1.if 语句
1 语法结构: 2 if (/* 条件表达式 */){ 3 // 成立执行语句 4 } else { 5 // 否则执行语句 6 } 7 8 三元运算:对if……else语句的一种简化写法 9 条件表达式 ? 成立执行表达式 : 不成立执行表达式
2.switch 语句
3.while 语句
1 语法结构: 2 while (循环条件) { 3 //循环体 4 }
4.do...while 语句
5.for 语句
语法结构: // for循环的表达式之间用的是;号分隔的,千万不要写成, for (初始化表达式1; 判断表达式2; 自增表达式3) { // 循环体4 }
6.continue 和 break
break:立即跳出整个循环,即循环结束,开始执行循环后面的内容(直接跳到大括号); continue:立即跳出当前循环,继续下一次循环(跳到i++的地方)
四、函数
1.什么是函数
1 把一段相对独立的具有特定功能的代码块封装起来,形成一个独立实体,就是函数,起个名字(函数名),在后续开发中可以反复调用; 2 函数的作用就是封装一段代码,将来可以重复使用;
2.函数的定义
1.函数声明: function 函数名(){ // 函数体 } 2.函数表达式: var fn = function() { // 函数体 }
3.函数的调用
4.函数的返回值
返回值详解: 如果函数没有显示的使用 return 语句 ,那么函数有默认的返回值:undefined 如果函数使用 return 语句,那么跟再 return 后面的值,就成了函数的返回值 如果函数使用 return 语句,但是 return 后面没有任何值,那么函数的返回值也是:undefined 函数使用 return 语句后,这个函数会在执行完 return 语句之后停止并立即退出,也就是说 return 后面的所有其他代码都不会再执行。
5.apply、call、bind方法
apply 和 call 是调用的时候改变 this 指向;
bind 方法,是赋值一份的时候,改变了 this 的指向;
6.高阶函数
7.闭包
7.1 什么是闭包:
闭包简单理解:定义在一个函数内部的函数;
7.2 闭包的用途:
作用一:可以在函数外部读取函数内部成员;
作用二:让函数内成员始终存活在内存中;
8.递归
8.1 什么是递归
在函数中直接或间接的调用自己;
五、预解析
1.什么是预解析
JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候,分为两个过程:预解析过程和代码执行过程 预解析过程: 1. 把变量的声明提升到当前作用域的最前面,只会提升声明,不会提升赋值。 2. 把函数的声明提升到当前作用域的最前面,只会提升声明,不会提升调用。 3. 先提升var,在提升function
六、对象
1.对象的创建方式
第一种:对象字面量 var o = { name: ‘zs‘, age: 18, sex: true, sayHi: function () { console.log(this.name); } }; 第二种:new Object()创建对象 var person = new Object(); person.name = ‘lisi‘; person.age = 35; person.job = ‘actor‘; person.sayHi = function(){ console.log(‘Hello,everyBody‘); } 第三种:工厂函数创建对象 function createPerson(name, age, job) { var person = new Object(); person.name = name; person.age = age; person.job = job; person.sayHi = function(){ console.log(‘Hello,everyBody‘); } return person; } var p1 = createPerson(‘张三‘, 22, ‘actor‘); 第四种:自定义构造函数 function Person(name,age,job){ this.name = name; this.age = age; this.job = job; this.sayHi = function(){ console.log(‘Hello,everyBody‘); } } var p1 = new Person(‘张三‘, 22, ‘actor‘);
2.内置对象
JavaScript中的对象分为3种:内置对象、浏览器对象、自定义对象;
JavaScript 提供多个内置对象:Math/Array/Number/String/Boolean...
2.1 Math 对象
Math对象不是构造函数,它具有数学常数和函数的属性和方法,都是以静态成员的方式提供; Math.PI // 圆周率 Math.random() // 生成随机数 Math.floor()/Math.ceil() // 向下取整/向上取整 Math.round() // 取整,四舍五入 Math.abs() // 绝对值 Math.max()/Math.min() // 求最大和最小值 Math.sin()/Math.cos() // 正弦/余弦 Math.power()/Math.sqrt() // 求指数次幂/求平方根
2.2 Data 对象
创建 Data 实例用来处理日期和时间。Date 对象基于1970年1月1日(世界标准时间)起的毫秒数。
2.3 Array 对象
数组的常用方法: // 1 栈操作(先进后出) push() pop() //取出数组中的最后一项,修改length属性 // 2 队列操作(先进先出) push() shift() //取出数组中的第一个元素,修改length属性 unshift() //在数组最前面插入项,返回数组的长度 // 3 排序方法 reverse() //翻转数组 sort(); //即使是数组sort也是根据字符,从小到大排序 // 带参数的sort是如何实现的? // 4 操作方法 concat() //把参数拼接到当前数组 slice() //从当前数组中截取一个新的数组,不影响原来的数组,参数start从0开始,end从1开始 splice() //删除或替换当前数组的某些项目,参数start, deleteCount, options(要替换的项目) // 5 位置方法 indexOf()、lastIndexOf() //如果没找到返回-1 // 6 迭代方法 不会修改原数组(可选) every()、filter()、forEach()、map()、some() // 7 方法将数组的所有元素连接到一个字符串中。 join()
2.4 String 对象
字符串的常用方法: // 1 字符方法 charAt() //获取指定位置处字符 charCodeAt() //获取指定位置处字符的ASCII码 str[0] //HTML5,IE8+支持 和charAt()等效 // 2 字符串操作方法 concat() //拼接字符串,等效于+,+更常用 slice() //从start位置开始,截取到end位置,end取不到 substring() //从start位置开始,截取到end位置,end取不到 substr() //从start位置开始,截取length个字符 // 3 位置方法 indexOf() //返回指定内容在元字符串中的位置 lastIndexOf() //从后往前找,只找第一个匹配的 // 4 去除空白 trim() //只能去除字符串前后的空白 // 5 大小写转换方法 to(Locale)UpperCase() //转换大写 to(Locale)LowerCase() //转换小写 // 6 其它 search() replace() split() fromCharCode() // String.fromCharCode(101, 102, 103); //把ASCII码转换成字符串
3.构造函数
* 构造函数可以实例化对象 * 构造函数中有一个属性叫prototype,是构造函数的原型对象 * 构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数 * 实例对象的原型对象(__proto__)指向的是该构造函数的原型对象 * 构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的
4.原型和原型链
4.1 什么是原型和原型链
原型:__proto__和 prototype,都是原型对象;
原型链:是一种关系,实例对象和原型对象之间的关系,关系是通过原型( __proto__ )来联系的;
原型链:
如果一个对象的原型对象(__proto__),是另一个构造函数的实例,这个对象的原型对象就会指向另一个对象的原型对象,如此循环,就行成了原型链。
4.2 原型的作用
作用一:共享数据,节省内存空间;
作用二:为了实现继承
实例对象中有个属性,__proto__,也是对象,叫原型,不是标准的属性,浏览器使用的;
构造函数中有一个属性,prototype,也是对象,叫原型,是标准属性,程序员使用;
总结:
* 构造函数可以实例化对象
* 构造函数中有一个属性叫prototype,是构造函数的原型对象
* 构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
* 实例对象的原型对象(__proto__)指向的是该构造函数的原型对象
* 构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的
5.继承
5.1 什么是继承
继承:继承是一种关系,类(class)与类之间的关系;JS中没有类,但是可以通过构造函数模拟类,然后通过原型实现继承;继承也是为了数据共享;
5.2 原型链继承
核心:改变儿子的 prototype 属性为父亲的实例;
1 // 父亲类 2 function Parent() { 3 this.value = ‘value‘; 4 } 5 Parent.prototype.sayHi = function() { 6 console.log(‘Hi‘); 7 } 8 // 儿子类 9 function Child() { 10 11 } 12 // 改变儿子的prototype属性为父亲的实例 13 Child.prototype = new Parent(); 14 15 var child = new Child(); 16 // 首先现在child实例上进行查找,未找到, 17 // 然后找到原型对象(Parent类的一个实例),在进行查找,未找到, 18 // 在根据__proto__进行找到原型,发现sayHi方法。 19 20 // 实现了Child继承 21 child.sayHi();
缺点一:这种继承存在问题,就是引用类型属性共享;
1 // 父亲类 2 function Parent() { 3 this.color = [‘pink‘, ‘red‘]; 4 } 5 6 // 儿子类 7 function Child() { 8 9 } 10 Child.prototype = new Parent(); 11 12 var child1 = new Child(); 13 var child2 = new Child(); 14 // 先输出child1和child2种color的值 15 console.log(child1.color); // ["pink", "red"] 16 console.log(child2.color); // ["pink", "red"] 17 18 // 在child1的color数组添加white 19 child1.color.push(‘white‘); 20 console.log(child1.color); // ["pink", "red", "white"] 21 // child1上的改动,child2也会受到影响 22 console.log(child2.color); // ["pink", "red", "white"]
缺点二:无法向父类传参
5.3 借助构造函数
在这里,我们借用call函数可以改变函数作用域的特性,在子类中用 call 方法调用父类构造函数,复制父类的属性。此时没调用一次子类,复制一次。此时,每个实例都有自己的属性,不共享。同时我们可以通过call函数给父类传递参数。
好处一:解决应用类型共享问题
1 // 父亲类 2 function Parent(name) { 3 this.name = name; 4 this.color = [‘pink‘, ‘red‘]; 5 } 6 7 // 儿子类 8 function Child() { 9 Parent.call(this); 10 11 // 定义自己的属性 12 this.value = ‘test‘; 13 } 14 15 16 var child1 = new Child(); 17 var child2 = new Child(); 18 19 // 先输出child1和child2种color的值 20 console.log(child1.color); // ["pink", "red"] 21 console.log(child2.color); // ["pink", "red"] 22 23 // 在child1的color数组添加white 24 child1.color.push(‘white‘); 25 console.log(child1.color); // ["pink", "red", "white"] 26 // child1上的改动,child2并没有受到影响 27 console.log(child2.color); // ["pink", "red"]
好处二:解决传参数问题
1 // 父亲类 2 function Parent(name) { 3 this.name = name; 4 this.color = [‘pink‘, ‘red‘]; 5 } 6 7 // 儿子类 8 function Child(name) { 9 Parent.call(this, name); 10 11 // 定义自己的属性 12 this.value = ‘test‘; 13 } 14 15 var child = new Child(‘qq‘); 16 // 将qq传递给Parent 17 console.log(child.name); // qq
缺点:上述方法也存在一个问题,共享的方法都在构造函数中定义,无法达到函数复用的效果。
5.4 组合继承
根据上述两种方式,我们可以扬长避短,将需要共享的属性使用原型链继承的方法继承,将实例特有的属性,用借用构造函数的方式继承。
5.5 拷贝继承
6.函数中 this 的指向
* 普通函数中的this是谁?-----window * 对象.方法中的this是谁?----当前的实例对象 * 定时器方法中的this是谁?----window * 构造函数中的this是谁?-----实例对象 * 原型对象方法中的this是谁?---实例对象
七、正则表达式
1.JavaScript中创建正则表达式的方式
1.通过构造函数创建对象 //对象创建完毕--- var reg=new RegExp(/\d{5}/); //调用方法验证字符串是否匹配 var flag=reg.test("我的电话是10086"); console.log(flag); 2.字面量的方式创建对象 var reg=/\d{1,5}/; var flag=reg.test("小苏的幸运数字:888"); console.log(flag);
2.重要的正则表达式
重要的正则表达式: 邮箱: [0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2} 中文: \u4e00-\u9fa5 /^[\u4e00-\u9fa5]{2,6}$/ 表示2到6个中文
八、JavaScript的垃圾回收机制
九、JavaScript的运行机制
标签:理解 job bind 参数 特定 splice 实例 时间 独立
原文地址:https://www.cnblogs.com/lize520/p/10951371.html