JavaScript一些概念

JavaScript的执行

浏览器分为：渲染器和JS引擎

渲染器：用来解析HTML和CSS，俗称内核。chrome的blink和webkit都是内核

JS引擎：也称JS解释器。用来读取网页中的JavaScript代码，对其处理后运行，比如chrome浏览器的V8

JS引擎运行分为两步：预解析，代码执行

预解析：JS引擎会把JS里面所有的va r 还有function提升到当前作用域的最前面

代码执行：按照代码书写顺序从上往下执行

浏览器本身并不执行JS代码，而是通过内置的JavaScript引擎来执行JS代码。JS引擎执行代码时逐行解释每一句源码（转为机器语言），然后计算机去执行。所以JavaScript语言归为脚步语言，会逐行解释执行。

数据类型：Number,String,Boolean,Undefined,Null,Object

检测数据类型函数：typeof

var foo = 'bar';
console.log(typeof foo);

Object创建方式

对象字面量创建对象{}

对象字面量：就是花括号{}，{}里面包含了表达这个具体事务（对象）的属性和方法

var obj = {};//创建了一个空对象
var obj1 = {
	//属性
	userName:'鲁大师',
	age:28,
	//方法
	cook:function(){
		return '做饭'
	}
}
//对象属性和方法的调用:对象名.属性名    对象名.方法名
obj1.userName;obj1.cook

new Object创建对象

var obj = new Object {};//创建了一个空对象
obj.userName = '鲁大师';
obj.age = 18;
obj.cook = function(){
		return '做饭'
	}
//对象属性和方法的调用:对象名.属性名    对象名.方法名
obj.userName;obj.cook

构造函数创建对象

构造函数的三大特点：
a：构造函数的函数名的第一个字母通常大写。
b：函数体内使用this关键字，代表所要生成的对象实例。
c：生成对象的时候，必须使用new命令来调用构造函数。

function Star(uname,age,sex) {
	this.name= uname;
	this.age = age;
	this.sex= sex;
	this.sing = function(sang){
		console.log(sang);
	}
}
//调用
var idh = new Star('刘德华',18,'男');
console.log(idh.name);
idh.sing('冰雨');

JavaScript函数,作用域,闭包

函数创建的两种方式

JavaScript 使用关键字 function 定义函数。
函数可以通过声明定义，也可以用表达式来定义。

函数声明

关键字    函数名         参数
function functionName(parameters) {
	表达式
   //要执行的代码
}

实例

function eat(foodName) {
	return '吃'+foodName;
}
//函数调用
eat(‘苹果’);

匿名函数

有关键词 function， 有小括号，有大括号，就是没有函数名。

关键字    函数名         参数
function (parameters) {
	表达式
   //要执行的代码
}

匿名函数执行方式
(匿名函数)();
(匿名函数() );

(function eat(foodName) {
	return '吃'+foodName;
})('西瓜');

(function eat(foodName) {
	return '吃'+foodName;
}('西瓜'));

函数表达式

var  eat = function (foodName) {
	return '吃'+foodName;
}
//在变量中保存函数表达式之后，此变量可用作函数
eat(‘苹果’);

作用域

变量在某个范围内起作用和效果的区域，叫作用域。目的提高程序可靠性和减少命名冲突

全局作用域

在整个script标签内，或者是在一个单独的JS文件内的所有位置起作用

局部（函数）作用域

函数内部的作用域叫局部作用域

块作用域（ES6后）

在{},if{},for{}的花括号内的作用域叫块作用域

根据作用域不同，变量分为全局变量和局部变量

注意

1:在函数内部没有声明直接赋值的变量也属于全局变量，在函数外部可以访问
2:内部函数可以访问外部函数变量

作用域链(就近原则)

根据内部函数可以访问外部函数变量的这种机制，用链式逐级查找决定那些数据能被内部函数访问，就称作作用域链.

闭包

JS中的闭包设计，是一种设计思想。其主要目的是保证函数内部变量既可以重用，又不被污染（不会被随意篡改）。

闭包如何产生：

当一个嵌套函数的内部（子）函数引用了嵌套的外部（父）函数的变量（或函数）时，就产生了闭包

闭包产生的条件：

①：一个函数嵌套另一个函数
②：内部函数引用了外部函数的数据（变量/函数）

特性：

①：函数嵌套函数
②：函数内部可以引用函数外部的参数和变量
③：参数和变量不会被垃圾回收机制回收

闭包的种类

//1、将函数作为另一个函数的返回值
function outer(){
	var count = 0;//这个变量外部不可以直接使用（可以理解为受保护变量）
	return function (){
		conut++;//通过内部函数操作受保护变量
		console.log(count);
	}
}
var inner = outer();//调用外部函数获取内部函数
inner();//调用内部函数操作受保护变量
//释放闭包
inner = null;

//2、将函数（外部）的实参传递给另一个函数（内部）使用
function showDelay(msg,time){
	setTimeout(function(){
		alert(msg);
	},time);
}
showDelay('消息来啦',2000);

参考

闭包应用

定义JS模块

具有特定功能的JS文件
将所有的数据和功能都封装在一个函数内部（私有的）
只向外暴露一个函数或有N个方法的对象
模块的使用者，只需要通过模块暴露的对象调用方法来实现对应的功能

//创建一个JS文件 myModel.js 内容如下
function myModel(){
	//私有变量
	var msg = 'my Massage';
	//方法
	function doSomething(){
		console.log(msg.toUpperCase());
	}
	
	function doOtherthing(){
		console.log(msg.toLowerCase());
	}
	//创建一个对象，该对象有上述两个方法
	var outVar = {
		doSomething:doSomething,
		doOtherthing:doOtherthing
	}
	//将对象暴露出去，方便外面调用
	return ourVar;
}
//在其他地方引用我们的闭包
<script type:"text/javascript" src="myModel"></script>
<script>
	// 初始化对象
	var model = myModel();
	//调用公开的方法
	model.doSomething();
	model.doOtherthing();
</script>

另一种写法

//创建一个JS文件 myModel.js 内容如下
(function (){
	//私有变量
	var msg = 'my Massage';
	//方法
	function doSomething(){
		console.log(msg.toUpperCase());
	}
	
	function doOtherthing(){
		console.log(msg.toLowerCase());
	}
	//创建一个对象，该对象有上述两个方法
	window.myModel = {
		doSomething:doSomething,
		doOtherthing:doOtherthing
	}
})()
//调用方法同上面一样