JS-高级-01

复习

Javascript简称:JS
JS分三个部分
	1.ECMAScript标准---基础的语法
	2.DOM	Document Object Model	文档对象模型
	3.BOM	Browser Object Model	浏览器对象模型
定义:
	是一门脚本语言
	是一门解释性语言
	是一门弱类型的语言
	是一门基于对象的语言
	是一门动态类型的语言

动态页面:
	页面由HTML、CSS、JS组成
	或向服务器发送请求,服务器没有页面,但动态生成该页面,返回给客户端
	
JS最初的目的:解决用户与服务器之间的交互问题
现在:JS做特效、游戏、移动端、服务端

JS的数据类型:
	简单(值类型):Undefined、Null、Boolean、Number、String
	复杂(引用类型):Object、Array、Date、RegExp、Function
	单体内置对象:Global、Math

各数据类型数据存储位置
	值类型----------------------->栈
	引用类型-------------------->引用-栈、值-堆
	
数据传递
	值类型---------------->值
	引用类型------------->地址

预解析
	1.全局解析(所有变量和函数的声明都会提前;同名的函数和对象,函数的优先级高)
	2.函数内部预解析(所有变量、函数、形参都会参与预解析)

执行流程:
	先预解析全局作用域,然后执行全局作用域中的代码
	在执行全局代码的过程中遇到函数调用就会先进行函数预解析,然后再执行函数内代码
	
对象:
	是一个特指的事物,具有属性和方法
	是一个无序属性的集合
	是一个容器,封装了属性(property-特征、状态)和方法(method-行为)			

编程思想:
	面向过程:所有事情亲历亲为,注重的是过程
	面向对象(OOP):提出需求,找相应对象解决,注重结果
	js不是面向对象语言,而是基于对象的语言,js模拟面向对象

面向对象的特性:
	封装(包装-把重复的代码封到函数里,提高代码利用率)
	继承(类与类的关系,js没有类的关系,js有构造函数的概念,基于原型)
	多态(同一个行为,针对不同的对象,产生不同的效果)

创建对象的三种方式

1.	字面量的方式
	var person = {
		name:	"小明";
		.......
	};
2.	调用系统的构造函数
	var jack = new Object();
	jack.sex = "男";
	..........
3.	自定义构造函数	
	function Person(name,....){
		this.name = name;
		.............
	};
	var jack = new Person("jack",.....);
	创建对象时系统做了什么?
		1.开辟空间存储对象
		2.把this设置为当前的对象
		3.设置属性和方法的值
		4.把this对象返回

工厂模式创建对象

function createObject(name,age){
	var obj = new Object();
	obj.name = name;
	obj.age = age;
	obj.sayHi = function(){
		console.log("你好");
	};
	return obj;
};
var person1 = createObject("小明","18");

构造函数和实例对象之间的关系

1.实例对象是通过构造函数创建的---创建的过程叫做实例化
2.如何判断对象是不是这个数据类型?
	1)通过构造器的方式==》实例对象.构造器 == 构造函数的名字
	2)对象 instanceof 构造函数名字		//推荐使用

构造函数创建对象带来的问题:

	每创建一个对象,都会为构造函数内的方法开辟独立空间,容易造成空间浪费
	解决:
		1.可以将方法封装成函数放到外面	//不好,容易命名冲突
		2.用原型解决	

原型

---->__proto__或prototype;都是原型对象
作用:
	1.数据共享、节省内存空间

通过原型为构造函数添加方法
	//构造函数
	function Person(name,age){
		this.name = name;
		this.age = age;
	}
	//通过构造函数的原型添加方法
	Person.prototype.eat = function(){
		console.log("haha");
	};
	var per1 = new Person("小白",20);
	var per2 = new Person("小黑",25);
	console.log(per.__proto__.constructor==Person.prototype.constructor);==>true
	console.log(per.eat==per2.eat);	==>true
	console.dir(Person)

	实例对象中有两个属性(通过构造函数获取的)
	构造函数中并没有name、age属性

	实例对象中有个__proto__,也是对象,叫原型,不是标准的属性,浏览器使用
	构造函数有个prototype,也是对象,叫原型,是标准属性,程序员使用
构造函数、实例对象和原型之间的关系
1.构造函数创建实例对象
2.构造函数有prototype属性---->原型对象
3.原型对象内有constructor构造器---->构造函数
4.原型对象内有方法
5.实例对象有__proto__属性---->原型对象===》调用原型对象内方法

总结:
	构造函数可以实例化对象
	构造函数中有一个属性叫prototype,是构造函数的原型对象
	构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
	实例对象的原型对象(__proto__)指向的是该创建其的构造函数的原型对象
	构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的

自我理解:实例对象是构造函数的复制体,其复制了构造函数所拥有的属性(包括prototype属性及其对原型的指向),
		实例对象可调用prototype的复制体__proto__指向的原型所拥有的方法

构造函数、实例对象和原型之间的关系

简单的原型写法
Person.prototype = {
	//必须手动修改构造器的指向
	constructor:Person,
	height:"170",
	weight:"60kg",
	study:function(){
		console.log("学习好开心啊!!");
	},
};
原形对象中的方法,可以互相调用
实例对象使用的属性或方法,先在实例对象中查找,找到了则直接使用;
找不到则去实例对象的__proto__指向的原型对象prototype中找,找到则使用,否则报错

为内置对象添加原型方法

Array.prototype.myReverse = functions(){
	for(var i = this.length-1;i>0;i--){
		console.log(this[i]);
	}
};
...............
---------------------------------------------------------------------------
把局部变量变成全局变量–>把局部变量给window就好
	//函数的自调用
	//一次性函数,声明的同时直接调用
(function(win--形参){
		var num = 10;	//局部变量
		win.num = num;
		console.log("函数");
	})(window--实参);
	console.log(window--num/num);	====>报错
-----------------------------------------------------------------------------------------------
<script>
    //产生随机数对象
    (function (window) {
        function Random(){}
        Random.prototype.getRandom = function(min,max){
            return Math.floor(Math.random()*(max-min)+min);
        };
        window.Random = new Random();
    })(window);
    (function(window){
        console.log(Random.getRandom(0,10));
    })();
</script>

猜你喜欢

转载自blog.csdn.net/weixin_42966943/article/details/88552985