JS学习小结：
学习javaScript脚本语言，首先我们要知道Javascript是什么？
Javascript是什么，简称Js，Js是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言，使用它的目的是与HTML超文本标记语言、Java 脚本语言（Java小程序）一起实现在一个Web页面中链接多个对象，与Web客户交互作用。从而可以开发客户端的应用程序等。
当前什么越来越强调沟通，而Js是最接近前后端的语言，越来越多的前后端框架的支持，使他的前途很明朗，作为一种解释型语言，Js强调实时，在线。
先看下Js的特性：脚本编写语言，基于对象的语言，简单性，安全性，动态性和跨平台特性。
Js的命名规范：有两种常用的命名规则
匈牙利命名法的原则：变量名=属性+类型+对象描述。他的关键是：以一个或多个小写字母作为前缀，前缀之后是一个或多个首字母大写的单词组合，该单词指明变量的用途。
驼峰命名法的原则：第一个单词以小写字母开始，之后每一个单词的首字母大写。例如：myFirstName、myLastName，这样的变量名看上去就像驼峰一样此起彼伏，因此得名。驼峰法的关键是：除第一个单词外，其他单词首字母大小，混合使用大小写字母来构成变量名和函数名，还可以使用下划线来形成逻辑断点，这样更能增强代码的可读性。
JS的注释规范：
JS中单行注释用“ // 注释内容” 标识，多行注释使用“ /* 注释内容 */ “标识。注释的作用是提高代码的可读性，不仅自己以后用着方便，也有助于别人阅读和理解你所编写的JS代码，注释中的内容不会在网页中显示。为了方便阅读，注释一般放在需要解释的语句结尾处或者周围。
在JavaScript中四种基本的数据类型：数值（整数和实数）、字符串型（用“”号或‘’括起来的字符或数值）、布尔型（使True或False表示）和空值。在JavaScript的基本类型中的数据可以是常量，也可以变量。由于JavaScript采用弱类型的形式，因而一个数据的变量或常量不必首先作声明，而是在使用或赋值时确定其数据的类型的。当然也可以先声明该数据的类型，它是通过在赋值时自动说明其数据类型的。
一个为 undefined 的值就是指在变量被创建后，但未给该变量赋值以前所具有的值。
--------------------------------------------------------------------------------------------------------------------
下面是一下常用语法：
1.对象定义方式
空对象：没有任何属性和方法
var obj = {};
定义对象的属性：
obj.xx = "123";
定义对象的方法：
obj.function = function(){};
--------------------------------------------------------------------------------------------------------------------
2.函数的定义方式：
JavaScript函数定义Function 函数名 （参数,变元）{函数体;.Return 表达式;}说明： 当调用函数时,所用变量或字面量均可作为变元传递。 函数由关键字Function定义。 函数名：定义自己函数的名字。 参数表，是传递给函数使用或操作的值，其值可以是常量 ，变量或其它表达式。 通过指定函数名（实参）来调用一个函数。 必须使用Return将值返回。 函数名对大小写是敏感的。
函数中的形式参数： 在函数的定义中，我们看到函数名后有参数表，这些参数变量可能是一个或几个。那么怎样才能确定参数变量的个数呢？在JavaScript中可通过arguments .Length来检查参数的个数。例：Function function_Name(exp1,exp2,exp3,exp4)Number =function _Name . arguments .length;if (Number>1）document.wrile(exp2);if (Number>2)document.write(exp3);if(Number>3)document.write(exp4);...
--------------------------------------------------------------------------------------------------------------------
3 对象的引用传递
var person={name:'anker',age:100};
var x = person;
x.age = 19;
console.log(x.age);//19
console.log(person.age);//19
说明js中对象的赋值也是采用引用的方式，同时指向同一个对象。
function changebj(obj) {obj.age = 10};
changebj(person);
console.log(person.age);
10//打印结果也是10,说明函数传递的也是对象的引用。修改的是同一个对象。
person.sex = '男';//若该属性不存在则添加，若存在则覆盖。
访问对象的方式：
obj.name
obj["name"]或者obj['name']//必须采用双引号或者单引号括起来
--------------------------------------------------------------------------------------------------------------------
4.匿名函数
（function(){//代码 })(); //可立即执行的匿名函数
解释：，包围函数（function(){})的第一对括号向脚本返回未命名的函数，随后一对空括号立即执行返回的未命名函数，括号内为匿名函数的参数。
例子：(function(arg){ alert(arg+100); })(20);
这个例子返回120。
匿名函数，就是没有引用直接加上()进行执行的函数。
var addFunc = function(a,b){
cosole.log(a+b);
};
--调用方式
addFunc(1,2);
--匿名函数
(function(a,b){console.log(a+b)})(1,2);
上面两个函数的产生的结果是一样的.只不过addFunc为函数对象的引用,而匿名函数不存在引用.
--来看个复杂的利用匿名函数的例子
var add = (function(){
var sum = 0 ;
return function(){
for(var i=0;l=arguments.length,i<l;i++){
sum+=arguments[i];
}
return sum;
};
})(); --加上括号为匿名函数的写法,可以理解为直接执行了此函数,函数的执行结果返回
add(1,2,3,4);
add(2);
--等价于
var func1 = function(){
var sum = 0 ;
return function(){
for(var i=0;l=arguments.length,i<l;i++){
sum+=arguments[i];
}
return sum;
};
};
var add = func1();
add(1,2,3,4);
add(2);
//现在有一个场景，需要设计一个函数，前面每次调用，不会真正去计算，而是把参数保存下来，等到需要计算的再一起计算
var currying = function(fn){
var args = [] ;
return function(){
if(arguments.length === 0){
return fn.apply(this,args);
}else {
Array.PRototype.push.apply(args,arguments);
return arguments.callee;
}
};
}
var add = (function(){
var sum = 0 ;
return function(){
for(var i=0;l=arguments.length,i<l;i++){
sum+=arguments[i];
}
return sum;
};
})();
var add = currying(add);
add(1);
add(2);
add(3);
add();
---------------------------------------------------------------------------------------------------------------------
5.闭包
可以理解成一个函数内的内部函数，它被创建在一个函数内部，引用这其外部函数的变量值。
var a = function(){
var x = 1;
return function(y){
console.log(x+=y);//外部函数的x值就被包裹在引用对象中
}
}
var b = a();//实际上是返回function(y){...}的引用
b();//执行上面的引用，此时的x值变成了private的属性
闭包的两个作用：
1.可以读取函数体所在外部函数的局部变量
2.就是让这些变量的值始终保持在内存中
------------------------------------------------------------------------------------------------------------------------
6.constructor
constructor 属性返回对创建此对象的数组函数的引用。
var test=new Array();
if (test.constructor==Array)//判断test的构造函数是否是Array
{
document.write("This is an Array");
}
var createPerson = function(name,sex,age){
this.name = name;
this.sex = sex;
this.age = age;
};
//undefined
var p1 = new createPerson('z1',19,'男');
//undefined
p1.constructor
//输出
function (name,sex,age){
this.name = name;
this.sex = sex;
this.age = age;
}
p1.constructor == createPerson
//输出：true
createPerson.constructor
//Function() { [native code] } //createPerson构造函数为Function,从一个侧面说明function也是对象
------------------------------------------------------------------------------------------------------------------------
7.js ==与 ===的区别
一个等号是赋值操作，==先转换类型再比较，进行值的对比。
而===先判断类型，如果不是同一类型直接为false，只有类型和值全部都相等，才相等。
------------------------------------------------------------------------------------------------------------------------
8.JS中一切皆对象
JS中基本数据类型，也存在着对象封装，比如下面数字123的构造函数是Number,test的构造函数是String，包含length的属性
(123).constructor
//输出：function Number() { [native code] }
'test'.constructor
//输出：String() { [native code] }
'test'.length;
//输出：4
//扩展Number的函数
Number.prototype.toString = function(){
alert('hi,I/'m a number ');
};
(123).toString();
//输出：hi,I/'m a number
Number.prototype
Number {toString: null, [[PrimitiveValue]]: 0}
------------------------------------------------------------------------------------------------------------------------
9.prototype原型
每个对象都连接到一个原型对象，并且可以从中继承属性。所有通过{}或者构造函数创建的对象都连接到Object{}
对象通过(对象名称.__proto__)可以查看原型
或者通过(对象名称.constructor.prototype)查看原型
var createPerson = function(name,sex,age){
this.name = name;
this.sex = sex;
this.age = age;
};
var p1 = new createPerson('z1',19,'男');
p1.constructor
//输出：
fucntion(name,sex,age){
this.name = name;
this.sex = sex;
this.age = age;
}
p1.constructor.prototype
//输出：
Object {}
createPerson.prototype
//输出：
Object {}
p1.constructor.prototype === createPerson.prototype
true
var p2 = {sex:'男'};
p2.constructor.prototype
//输出：Object {}
/*
在javascript中，创建一个新对象时，可以选择某个对象作为它的原型，比如
*/
var person = {name:'z3',age:18,sex:'男'};
Object.create = function(o){
var F = function(){};
F.prototype = o ;
return new F();
};
var anotherPerson = Object.create(person);
anotherPerson.name;//z3
//对原型对象进行更新,发现已创建的对象值也随着变化
person.name = 'z4';
"z4"
anotherPerson.name
//输出："z4"
//但当对象增加相同的属性后,原型对象的属性变化，不影响对象的属性值。因为对象读取值首先读取本身对象的值，后读取原型的值
anotherPerson.name = 'z5';
person.name = 'z6';
//输出："z6"
anotherPerson.name
//输出："z5"
delete anotherPerson.name
//输出：true
anotherPerson.name//输出对象本身的属性值,原型对象的属性值不会被删除,除非通过delete 原型对象.属性输出.
//输出："z6"
delete person.name
//输出：true
anotherPerson.name
//输出：undefined
//原型连接什么时候起作用呢？只有在检索值的时候才被用到
//如果尝试者去获取对象的某个属性值，但该对象没有此属性名，那么JAVASCRIPT会尝试着从原型对象中获取属性值。
//如果原型对象也没有该属性值则再从它的原型找，直到该过程最后达到终点Object.prototype。Object
//如果想要的属性完全不存在于原型链中，那么结果就是undefined。
person.age = 18;
anotherPerson.age//显示什么？
//原型关系是一种动态的关系。如果添加一个新的属性到原型中，该属性会立即对所有基于该原型创建的对象可见。
anotherPerson.__proto__===person;//true
__proto__显示对象的原型链
//可以使用hasOwnProperty方法来判断对像是否含有某个属性，如果对象拥有独有的属性，则返回true
//这个方法不会去检查原型链
------------------------------------------------------------------------------------------------------------------
10. arguments
arguments 对象是函数内部的本地变量；arguments 已经不再是函数的属性了。
你可以在函数内部通过使用 arguments 对象来获取函数的所有参数。这个对象为传递给函数的每个参数建立一个条目，
条目的索引号从 0 开始。例如，如果一个函数有三个参数，你可以通过以下方式获取参数：
arguments[0]
arguments[1]
arguments[2]
参数也可以被重新赋值:
arguments[1] = 'new value';
arguments 对象并不是一个真正的Array。它类似于数组，但没有数组所特有的属性和方法，除了 length。
例如，它没有 pop 方法。不过可以将其转换成数组
------------------------------------------------------------------------------------------------------------------------
11.利用JS特性实现AOP
AOP就是面向切面编程，主要作用是把一些核心业务逻辑模块无关的功能抽离出来，这些跟业务逻辑无关的功能
通常包括日志统计，安全控制，异常处理等。把这些功能抽离出来后，又通过动态织入的方式渗入到业务逻辑模块中
在JAVA中，可以通过反射和动态代理机制来实现AOP。但对于javascript这种动态语言，AOP的实现更加简单
在javascript中实现AOP，都是指把一个函数动态织入到另外一个函数中。我们可以通过扩展Function.prototype来做到这一点
*/
Function.prototype.before = function(beforefn){
var that = this ;
return function(){
beforefn.apply(this,arguments);
return that.apply(this,arguments);
};
};
Function.prototype.after = function(afterfn){
var that = this ;
return function(){
var ret =that.apply(this,arguments);
afterfn.apply(this,arguments);
return ret ;
};
};
var func = function(){
console.log(2);
};
func = func.before(function(){
console.log(1);
}).after(function(){
console.log(3);
});
func();
var func1 = document.getElementById;
undefined
func1('nt-contents');
//报错信息如下, 是由于document.getElementById函数中的this指向为windows对象,而windows对象不存在这些变量。
VM245:1 Uncaught TypeError: Illegal invocation(…)
//写那么复杂主要是将this的指向还是定位到document上面
var getElementById1 = (function(func){
return function(){
return func.apply(document,arguments);
}
})(document.getElementById);
------------------------------------------------------------------------------------------------------------------------
12.利用JS特性实现一些有趣的Function
var getId = document.getElementById1; //返回 这个对象 function(){return func.apply(document,arguments);}
var div = getId('ntp-contents');//返回func.apply(document,arguments)的对象，arguments参数值div1,func执行闭包中的document.getElementById函数
alert(div.id);
//我们上节课讲到，怎么在一个内部函数中保持外层的this上下使用了一个变量that来保存外,还可以使用以下方法
Function.prototype.bind =function(context){
var self = this ;
return function(){
alert(self);
alert(context);
return self.apply(context,arguments);
}
};
var obj ={name : 'steven'};
var func = (function(){
alert(this.name)
}).bind(obj);
var isType =function(type){
return function(obj){
return Object.prototype.toString.call(obj)==='[object '+type+']';
};
};
var isString = isType('String');
isString('hello world');
var isArray = isType('Array');
isArray([2,3]);
13.call、apply的使用
语法
function.call(thisObj,param1,param2,param3...);
function.apply(thisObj,[param1,param2,param3...]);
用法是改变function的作用域，将参数的上下文作用域修改成thisObj对象, 也可以说this对象为thisObj.
默认的function的作用域是window，this相当于window.function
新闻热点
疑难解答
