web前端知识1

1. nodejs 是什么？可以做什么？为什么擅长做？
   Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。Node.js 的包管理器 npm，是全球最大的开源库生态系统。
   一般认为javascript是浏览器端的脚本语言，但是google将其再开发，用来作为服务器端脚本环境，其性能自称比Python、Perl、PHP还要快。
   node.js的最大优点是处理并行访问，如果一个web应用程序同时会有很多访问连接，就能体现使用node.js的优势。
   另一个好处是，使用javascript作为服务器端脚本语言，可以消除一些与浏览器端js脚本的冲突。甚至发挥javascript动态编程的特性，在服务器与浏览器之间建立直接的动态程序。
   Node.js使用Module模块去划分不同的功能，以简化应用的开发。Modules模块有点像C++语言中的类库。每一个Node.js的类库都包含了十分丰富的各类函数。

2. npm 是什么? 如何安装 node 应用？全局安装和本地安装有什么区别？ –save与–saveDev的区别？ node_module的查找依赖的路线是怎样的?
   npm是node的模块包管理器。主要用于管理node包，包括：安装、卸载、更新、查看、搜索、发布等。
   下载nodejs，就会自动得到npm，使用 npm install 模块名 命令安装node应用。
   全局安装：npm install -g 模块名。模块会被下载到到特定的系统目录下，安装的模块能够在所有目录下使用。
   本地安装：npm install 模块名。模块会被下载到当前所在目录，也只能在当前目录下使用。
   当你为你的模块安装一个依赖模块时，正常情况下你得先安装他们（在模块根目录下npm install module-name），然后连同版本号手动将他们添加到模块配置文件package.json中的依赖里（dependencies）。
   -save和save-dev可以省掉你手动修改package.json文件的步骤。
   npm install

3.写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。
构造函数模式
//构造函数模式
function Person(name,age) {
this.name = name;
this.age=age;
}
Person.prototype.sayName = function () {
console.log(this.name);
};
var xiaoming = new Person(“xiaoming”,18);
console.log(xiaoming);
混合模式
//混合模式
function Person(name,age) {
this.name = name;
this.age=age;
}
Person.prototype.sayName = function () {
console.log(this.name);
};
function Student(name,age,school) {
Person.call(this,name,age);
this.school =school;
}
function creat(obj) {
function Fn() {}
Fn.prototype = obj;
return new Fn();
}
Student.prototype = creat(Person.prototype);
Student.prototype.saySchool =function () {
console.log(this.school);
};
var xiaoming = new Student(“xiaoming”,18,”家里蹲大学”);
xiaoming.saySchool();
xiaoming.sayName();
模块模式

requireJS、r.js
1. 如下requirejs配置中, baseUrl 有什么作用？以什么作为基准? paths 的作用和用法是什么?

requirejs.config({
baseUrl: “src/js”,
paths: {
‘jquery’: ‘lib/bower_components/jquery/dist/jquery.min’
}
});
baseUrl是指定一个基准目录，之后的paths内的路径都是相对于基准目录的相对定位。
设置baseUrl是以index.html文件的目录为基准。
paths作用：就是给所有引入的依赖模块起个名字，方便以后的使用。
path用法：名称（jquery）和路径（lib/bower_components/jquery/dist/jquery.min），路径是相对于 baseUrl 的路径。
2. 如下 r.js 的打包配置中 baseUrl 是什么? name 是什么

({
baseUrl: “./src/js”,
paths: {
‘jquery’: ‘lib/bower_components/jquery/dist/jquery.min’
},
name: “main”,
out: “dist/js/merge.js”
})
r.js 的打包配置中 baseUrl 就是requirejs配置中的baseUrl。但是设置这里的baseUrl要注意一下，设置baseUrl时是以自身文件（build.js）的目录为基准的。
name:指的是解析的入口。一般都是requirejs配置文件。路径名当然也是相对于baseUrl的。

CMD、AMD、CommonJS 规范
为什么要使用模块化？
所谓的模块化就是一个模块为一个js文件，达到多个模块一起使用的目的。就像java中使用@import引入不同的类，达到多个类一起使用的方式。
在前端引入多个js文件会产生几个恼人的问题，一个是命名冲突。我的js文件中用了这个接口名你的就不能使用。第二个就是烦琐的文件依赖，而且还不能放错顺序。第三个是如果一个网页有很多的js文件，那么浏览器在下载该页面的时候会先加载js文件，从而停止了网页的渲染，如果文件越多，浏览器可能失去响应。
CMD、AMD、CommonJS 规范分别指什么？有哪些应用
CommonJS
* CommonJS是服务器端模块的规范，Node.js采用了这个规范。
* 根据CommonJS规范，一个单独的文件就是一个模块。每一个模块都是一个单独的作用域，也就是说，在该模块内部定义的变量，无法被其他模块读取，除非定义为global对象的属性。
* 输出模块变量的最好方法是使用module.exports对象。
main.js
exports.add = function() {
var sum = 0, i = 0, args = arguments, l = args.length;
while (i < l) {
sum += args[i++];
}
return sum;
};
increment.js

var add = require(‘math’).add;
var result = add(32,45,9,85);
AMD
正好我的任务32是用三个对象写的，把每个对象拆成一个js文件，使用requirejs把对象做成模块。用requirejs写的任务32：
效果预览
github代码
CMD
CMD（Common Module Definition） 通用模块定义。该规范明确了模块的基本书写格式和基本交互规则。该规范是在国内发展出来的。AMD是依赖关系前置，CMD是按需加载。

seajs.use('./main.js');

继承
继承有什么作用?

继承是代码重用的方式，避免重复造轮子。在基于类继承的语言中，继承是代码重用的唯一方式。但是js中有更好的方式。
在基于类的语言中，对象是类的实例，类可以从另一个类继承。js是一门基于原型的语言，这意味着对象可以直接继承其他对象。
有几种常见创建对象的方式? 举例说明?

//工厂模式
function makeCake(name,taste) {
var obj = {
name : name,
taste : taste,
sayName : function () {
console.log(“我是”+name+”牌子的”);
}
};
return obj;
}
var a = makeCake(“Mcake”,”甜的”);
var b = makeCake(“incake”,”奶油香”);
//构造函数模式
function MakeCake(name,taste) {
this.name = name;
this.taste = taste;
this.sayName = function () {
console.log(“我是”+this.name+”牌子的”);
};
}
var a = new MakeCake(“Mcake”,”甜的”);
var b = new MakeCake(“incake”,”奶油香”);
//原型模式
function MakeCake(name,taste) {
this.name = name;
this.taste = taste;
}
MakeCake.prototype.sayName = function () {
console.log(“我是”+th

原型链
有如下代码，解释Person、 prototype、proto、p、constructor之间的关联。
function Person(name){
this.name = name;
}
Person.prototype.sayName = function(){
console.log(‘My name is :’ + this.name);
}
var p = new Person(“若愚”)
p.sayName();
文字解释：
1. Person是构造函数，它的prototype属性指向一个对象，成为原型对象。
2. p是Person的实例，每个实例的proto属性都指向其构造函数的prototype对象。
3.constructor是每个prototype对象指回去的属性，没什么用。
图形解释：

1. 上例中，对对象 p可以这样调用 p.toString()。toString是哪里来的? 画出原型图?并解释什么是原型链。
   
   • toString 是从Object.prototype中继承而来。
   • 原型图上题已经画出来了。
   • 原型链就是js的继承方式，js是一门基于原型链继承的语言，只要一个对象的原型
     （即proto）指向另一个对象就可以继承那个对象的所有属性。
   • 当调用一个对象的属性时，该对象会先从自己里面找，找不到就从自己原型中找，再找不到，就从自己原型的原型中找，一层层的找，最终找到Object.prototype中，在往上就是null了。
2. 对String做扩展，实现如下方式获取字符串中频率最高的字符

//todo….
var str = ‘ahbbccdeddddfg’;
var ch = str.getMostOften();
console.log(ch); //d , 因为d 出现了5次
var str = ‘ahbbccdeddddfg’;
String.prototype.getMostOften = function () {
var arr1 ;
var obj;
va

对象、原型
OOP 指什么？有哪些特性

OOP是指面向对象的编程。
面向对象的编程本质上就是模仿现实世界的一种编程方式，解决问题的时候第一考虑的是并不是怎么做，而是谁去做。比如说让小明做数学作业，首先考虑的是小明是一个人，那就创造一个叫做人的类，然后让人这个类拥有一个做数学作业的行为（即方法函数）。既然小明要做作业，那小明在哪里做作业呢，假设在家里好了，那我们再创建一个叫做家的类。在家这个类里面，我们通过人这个类把小明创造出来。（用java的方式来写的话大概是这样吧：People xiaoming = new People()），然后再让小明做作业，（xiaoming.dohomework()）。
特性：
类：类是封装代码的模式。和js的模块化作用很像。
封装：封装就是类的私有属性，只能我这个类去访问，其他的类无法访问。
继承：基于类继承的语言中，继承是唯一代码重用的方式。
多态：用上述的例子来说，我们可以再创造一个中国人的类，和一个美国人的类，中国人和美国人都继承自人这个类。不好解释了，简单来说就是人这个类的实例去做一件事情，动态传进来中国人的实例，可以执行这个函数。传进来美国人的实例，也可以执行这个函数。中国人这个类和美国人这个类都可以看作是人这个类的子类型。
造型：这个就更不好解释了，比如说B这个类继承A， A a1 = new B();B b1 = (B) a1;
没错a1本来就是B类的实例，但是还是要向下造型为B类。特无聊的方式。
如何通过构造函数的方式创建一个拥有属性和方法的对象?

function People(name,age,fnc) {
this.name = name;
this.age=age;
this.dosomething=fnc;
}
var xiaoming = new People(“xiaoming”,15,function () {
alert(“hello”);
});
console.log(xiaoming.name);
console.log(xiaoming.age);
xiao

HTTP
1. OSI 七层模型指什么

国际标准化组织（ISO）制定的一个用于计算机或通信系统间互联的标准体系，它是一个七层的、抽象的模型，不仅包括一系列抽象的术语或概念，也包括具体的协议。
物理层（Physical Layer）：
建立、维护、断开物理连接。（由底层网络定义协议）
数据链路层 (Link)：
建立逻辑连接、进行硬件地址寻址、差错校验等功能。（由底层网络定义协议）
将比特组合成字节进而组合成帧，用MAC地址访问介质，错误发现但不能纠正。
网络层 (Network)：
进行逻辑地址寻址，实现不同网络之间的路径选择。
协议有：ICMP IGMP IP（IPV4 IPV6） ARP RARP
传输层 (Transport)：
定义传输数据的协议端口号，以及流控和差错效验。
协议有：TCP UDP，数据包一旦离开网卡即进入网络传输层
会话层（Session Layer）：
建立、管理、终止会话。（在五层模型里面已经合并到了应用层）
对应主机进程，指本地主机与远程主机正在进行的会话
表示层（Presentation Layer）：
数据的表示、安全、压缩。（在五层模型里面已经合并到了应用层）
格式有，JPEG、ASCll、DECOIC、加密格式等
应用层 (Application)：
网络服务与最终用户的一个接口。
协议有：HTTP FTP TFTP SMTP SNMP DNS
2. HTTP 的工作原理是什么？

HTTP目前协议的版本是1.1.HTTP是一种无状态的协议，无状态是指Web浏览器和Web服务器之间不需要建立持久的连接，这意味着当一个客户端向服务器端发出请求，然后Web服务器返回响应(response)，连接就被关闭了，在服务器端不保留连接的有关信息.HTTP遵循请求(Request)/应答(Response)模型。Web浏览器向Web服务器发送请求，Web服务器处理请求并返回适当的应答。所有HTTP连接都被构造成一套请求和应答。

1. URI 的格式是什么？常见的协议有哪些

通用的URL由9部分组成
://:@:

this、闭包
apply、call 有什么作用，什么区别

作用：都可以改变函数内参数this的指向。
例如让数组使用Math的min方法：Math.min.apply(null,[2,7,3]);
由于apply的第二个参数是传递给函数的参数数组。所以相当于Math.min(2,7,3);
区别：call可以有多个参数，第一个参数是this绑定的对象，其他参数是传给函数的参数；
apply只有两个参数，第一个参数是this绑定的对象，第二个参数是传递给函数的参数 数组。
写法上有差别：
var john = {
firstName: “John”,
surname: “Smith”
}
function func(a, b) {
alert( this[a] + ’ ’ + this[b] )
};
func.call(john, ‘firstName’, ‘surname’)//输出”John Smith”
func.apply(john, [‘firstName’, ‘surname’])//输出”John Smith”
代码

以下代码输出什么?
输出 “John: hi!”
var john = {
firstName: “John”
}
function func() {
alert(this.firstName + “: hi!”)
}
john.sayHi = func //给john这个对象增加一个属性，属性名为sayHi,属性值为func函数
//当一个函数作为对象的属性值的时候，我们称它为方法。
john.sayHi(); //输出结果是”John: hi!”
//john.sayHi()相当于以方法的方式调用func，此时func中的参数this指的是它所在对象，即john。
//john的firstName属性的属性值是”John”，所以输出结果为”John: hi!”
2 . 下面代码输出什么，为什么

func() //首先函数声明会提升，这样调用函数不会报错
//以函数的方式调用func，相当于window.func，func里面

同源策略、跨域、jsonp
什么是同源策略

同源指的是协议，域名，端口号都相同。
同源策略是浏览器的一个功能，不同源的客户端脚本，在没明确授权的情况下，不能读写对方的资源。
什么是跨域？跨域有几种实现形式

跨域 就是在协议和端口号都一样的情况下，突破同源策略的限制。
实现形式：
降域：不同的子域名可以通过降域的方式实现跨域，例如：http://child1.a.com和 http://child2.a.com可以在两个脚本中都写上 document.domain = ‘a.com’ , 将域名降为a.com。
JSONP
CORS
HTML5 postMessage
window.name
location.hash
jsonp的原理是什么

a.com不可以读写b.com的资源，但是a.com可以引入b.com的js文件。
a.com在引用b.com的js文件的时候，再其url中加入查询字符串，在查询字符串里面传递回调函数。（?callback=getData）
b.com将它的数据data作为回调函数的参数，通过这种形式：getData+”(“+data+”)” 就可以让a.com中的getData函数运行，并将data作为参数传递给getData。这样a.com就拿到b.com的data数据了。

CORS是什么
Cross-Origin Resource Sharing，跨域资源共享
b.com 的响应头中加入这一句话 Access-Control-Allow-Origin: http://a.com，表明b.com授权给http://a.com这个源，这个源就可以向b.com发送ajax请求，读写b.com的资源。
练习
在本地服务器上注册两个域名， a.com 和 b.com
使用任务29中无限滚动的代码进行测试


结果由于同源策略报错

解决方案之CORS


搞定，内容加载成功


解决方案之JSONP
jQuery中的$.ajax()已经封装好了Jsonp的方法，直接使用就好。

搞定，内容加载成功