学习前端一些知识点（二）

た入场券 2022-08-07 17:55 208阅读 0赞

四、JSON的优缺点  
优点：  
1. 数据格式比较简单，易于读写，格式都是压缩的，占用带宽小，浏览器解析快  
2. 易于解析这种语言，客户端JavaScript可以简单的通过eval()进行JSON数据的读取  
3. 构造友好，支持多种语言，包括ActionScript， C，C\#，ColdFusion，Java，JavaScript，Per，PHP，Python，Ruby等语言服务器端语言，便于服务器端的解析  
4. 在PHP世界，已经有PHP-JSON和JSON-PHP出现了，便于PHP序列化后的程序直接调用，PHP服务器端的对象、数组等能够直接生JSON格式，便于客户端的访问提取  
5. 因为JSON格式能够直接为服务器端代码使用，大大简化了服务器端和客户端的代码开发量, 但是完成的任务不变, 且易于维护  
6.相当稳定。JSON 的附加内容将成为超集  
缺点：  
1. 没有XML格式这么推广的深入人心和使用广泛，没有XML那么通用性  
2. JSON格式目前在Web Service中推广还属于初级阶段  
  
  
五，JavaScript面向对象基础：  
对象是JavaScript的基础。JavaScript的大部分功能都是基于对象的。从最基本的层次而言，对象是一系列属性的集合。  
// 创建一个新的Object对象，存放在 'obj' 变量中  
var obj = new Object();  
  
  
// 给这个对象设置一个属性  
obj.val = 5;  
obj.click = function()\{  
    alert( "hello" );  
\};  
  
  
// 简写方式，键值对（key/value pair）来定义属性  
var obj = \{  
    // 用键值对（key/value pairs）方式来设置属性名和属性值  
    val: 5,  
    click: function()\{  
        alert( "hello" );  
    \}  
\};  
2. 对象的创建  
   和大部分的其它面向对象的语言不同，JavaScript并没有类（class）的概念。其它面向对象语言大多需要实例化某个具体的类。  
   但JavaScript不同，JavaScript里对象本身可以用来创建新对象，而对象也可以继承自其它对象。这个概念称为原型化继承（prototypal inheritance）。  
   不管JavaScript使用何种对象方案，首先还是应该有一个创建新对象的方法。JavaScript的做法是，任何函数都可以被实例化为一个对象。  
   constructor 属性在每个对象中都存在，并一直指向创建它的函数。这样就可以有效地复制对象，用同一个基类创建对象并赋予不同的属性。  
   // 创建一个新的简单的User对象  
function User() \{\}  
  
  
// 创建一个User对象  
var me = new User();  
  
  
// 用前一个对象的 constructor 引用来创建对象  
var you = new me.constructor();  
  
  
// 这两个对象的 constructor 实质上是一致的  
alert( me.constructor == you.constructor );  
   3.公共方法（public method）在对象的上下文中是最终用户始终可以接触到的。要实现这种在对象的每个实例都可以使用的公共方法。必须了解 prototype（原型）的属性，这个属性包含一个对象，该对象可以作为所有新副本的基引用（base reference）。本质上说，所有对象原型的属性都能在该对象的每个实例中找到。  
   因为对象的原型仍然是对象，和其他任何对象一样，可以给它添加新的属性。给原型添加属性的结果是由该原型实例化的每个对象都会获得这些属性，也就使这些属性公有化了。  
   // 创建一个新的User构造函数  
function User( name, age )\{  
    this.name = name;  
    this.age = age;  
\}  
  
  
// 将一个新函数加到对象的 prototype 对象中  
User.prototype.getName = function()\{  
    return this.name;  
\};  
   // 再次给 prototype 对象添加一个函数  
User.prototype.getAge = function()\{  
    return this.age;  
\};  
   // 实例化一个新的User对象  
var user = new User( "Bob", 44 );  
   // 添加的这两个属性都在刚才创建的对象中，并且有合适的上下文  
alert( user.getName() == "Bob" );  
alert( user.getAge() == 44 );  
   4. 私有方法  
私有方法（private method）和私有变量只允许其他的私有方法、私有变量和特权方法访问。这种方法可以定义一些只让对象内部访问，而外部访问不到的代码。  
   // 表示教室的一个对象构造函数  
function Classroom( students, teacher ) \{  
    // 用于显示班级所有学生的私有方法  
    function disp() \{  
        alert( this.names.join(", ") );  
    \}  
  
  
    // 将班级数据存入公共属性中  
    this.students = students;  
    this.teacher = teacher;  
  
  
    // 调用私有方法来显示错误  
    disp();  
\}  
  
  
// 创建一个新的 classroom 对象  
var class = new Classroom( \[ "John", "Bob" \], "Mr. Smith" );  
  
  
// 调用 disp 方法会失败，因为它不是该对象的公共方法  
class.disp();  
  
  
jQuery：  
   $.each()函数不同于JQuery对象的each()方法，它是一个全局函数，不操作JQuery对象，而是以一个数组或者对象作为第1个参数，以一个回调函数作为第2个参数。回调函数拥有两个参数：第1个为对象的成员或数组的索引，第2个为对应变量或内容。  
   JQuery中$.ajax()方法参数详解：  
    url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。  
    type: 要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和  
      delete也可以使用，但仅部分浏览器支持。  
timeout: 要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局设  
         置。  
async：要求为Boolean类型的参数，默认设置为true，所有请求均为异步请求。  
       如果需要发送同步请求，请将此选项设置为false。注意，同步请求将锁住浏览器，用户其他操作必须等  
       待请求完成才可以执行。  
cache：要求为Boolean类型的参数，默认为true（当dataType为script时，默认为false）。  
       设置为false将不会从浏览器缓存中加载请求信息。  
data: 要求为Object或String类型的参数，发送到服务器的数据。如果已经不是字符串，将自动转换为字符串格  
      式。get请求中将附加在url后。防止这种自动转换，可以查看processData选项。对象必须为key/value格  
      式，例如\{foo1:"bar1",foo2:"bar2"\}转换为&foo1=bar1&foo2=bar2。如果是数组，JQuery将自动为不同  
      值对应同一个名称。例如\{foo:\["bar1","bar2"\]\}转换为&foo=bar1&foo=bar2。  
dataType: 要求为String类型的参数，预期服务器返回的数据类型。如果不指定，JQuery将自动根据http包mime  
          信息返回responseXML或responseText，并作为回调函数参数传递。  
          可用的类型如下：  
          xml：返回XML文档，可用JQuery处理。  
          html：返回纯文本HTML信息；包含的script标签会在插入DOM时执行。  
          script：返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求  
                  时（不在同一个域下），所有post请求都将转为get请求。  
          json：返回JSON数据。  
          jsonp：JSONP格式。使用SONP形式调用函数时，例如myurl?callback=?，JQuery将自动替换后一个  
                “?”为正确的函数名，以执行回调函数。  
          text：返回纯文本字符串。  
beforeSend：要求为Function类型的参数，发送请求前可以修改XMLHttpRequest对象的函数，例如添加自定义  
            HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参  
            数。  
            function(XMLHttpRequest)\{  
               this;   //调用本次ajax请求时传递的options参数  
            \}  
complete：要求为Function类型的参数，请求完成后调用的回调函数（请求成功或失败时均调用）。  
          参数：XMLHttpRequest对象和一个描述成功请求类型的字符串。  
          function(XMLHttpRequest, textStatus)\{  
             this;    //调用本次ajax请求时传递的options参数  
          \}  
success：要求为Function类型的参数，请求成功后调用的回调函数，有两个参数。  
         (1)由服务器返回，并根据dataType参数进行处理后的数据。  
         (2)描述状态的字符串。  
         function(data, textStatus)\{  
            //data可能是xmlDoc、jsonObj、html、text等等  
            this;  //调用本次ajax请求时传递的options参数  
error：要求为Function类型的参数，请求失败时被调用的函数。该函数有3个参数，即XMLHttpRequest对象、错  
       误信息、捕获的错误对象(可选)。  
       ajax事件函数如下：  
       function(XMLHttpRequest, textStatus, errorThrown)\{  
          //通常情况下textStatus和errorThrown只有其中一个包含信息  
          this;   //调用本次ajax请求时传递的options参数  
       \}  
contentType：要求为String类型的参数，当发送信息至服务器时，内容编码类型默认  
             为"application/x-www-form-urlencoded"。该默认值适合大多数应用场合。  
dataFilter：要求为Function类型的参数，给Ajax返回的原始数据进行预处理的函数。  
            提供data和type两个参数。data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的  
            dataType参数。函数返回的值将由jQuery进一步处理。  
            function(data, type)\{  
                //返回处理后的数据  
                return data;  
            \}  
global：要求为Boolean类型的参数，默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局  
        ajax事件，ajaxStart或ajaxStop可用于控制各种ajax事件。  
ifModified：要求为Boolean类型的参数，默认为false。仅在服务器数据改变时获取新数据。  
            服务器数据改变判断的依据是Last-Modified头信息。默认值是false，即忽略头信息。  
       jsonp：要求为String类型的参数，在一个jsonp请求中重写回调函数的名字。  
       该值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分，例如：  
       \{jsonp:'onJsonPLoad'\}会导致将"onJsonPLoad=?"传给服务器。  
username：要求为String类型的参数，用于响应HTTP访问认证请求的用户名。  
password：要求为String类型的参数，用于响应HTTP访问认证请求的密码。  
processData：要求为Boolean类型的参数，默认为true。默认情况下，发送的数据将被转换为对象（从技术角度  
             来讲并非字符串）以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM  
             树信息或者其他不希望转换的信息，请设置为false。  
scriptCharset：要求为String类型的参数，只有当请求时dataType为"jsonp"或者"script"，并且type是GET时  
             才会用于强制修改字符集(charset)。通常在本地和远程的内容编码不同时使用。  
  
  
       对闭包的理解：  
    在程序语言范畴内的“闭包”指的是函数把其中的变量作用域都“包”在该函数的作用域内，形成一个“包”，外部函数无法访问内部变量。所以严格意义上来说，JavaScript 中的函数都是闭包。但我们常说的闭包，通常是指为了让外部函数访问到内部函数中变量，使内部函数返回一个函数，在其中操作内部变量。  
  
  
      RESTful 的操作名：  
      GET, POST, DELETE  
HTTP 404、302、500、403 状态名是什么意思？？？  
404：服务器找不到请求的网页。例如，对于服务器上不存在的网页经常会返回此代码。  
302（临时移动）：302 Found 是HTTP协议中的一个状态码（Status Code）。可以简单的理解为该资源原本确实存在，但已经被临时改变了位置；  
500（服务器内部错误）：服务器遇到错误，无法完成请求。  
403（禁止）：服务器拒绝请求。  
     你认为前端是做什么的？  
     我会从广义和狭义两方面来说，狭义的前端是实现设计师的设计稿；广义的前端是所有跟用户打交道的环节。  
    模块化了解吗？  
    AMD、CMD  
移动平台的开发经验？  
响应式设计、Zepto；@media、viewport、JavaScript 正则表达式判断平台。  
如果一个元素 absolute，它是相对谁说的？  
如果它的父元素是非 static 值（这里自己说了 static，面试官上一题应该可以饶过我……），则相对父元素；否则相对是非 static 值的父元素的父元素……直到找到一个最近的非 static 值的祖先元素。如果都没有，则是相对 window 而言。  
如果一个元素 absolute，没设 left、top，位置是哪里？  
正确答案是，相当于 static 的默认位置。左上角之所以不准确，是因为如果父元素在本元素之前如果还有子元素的话，那就不是左上角了。  
var a=\["a","b","c","d"\] 每过 1 秒 alert 一下数组中的值？？  
for(var j = 0; j < 4; j++) \{  
    (function(i) \{  
        setTimeout(function() \{  
            alert(i);    
        \}, (i + 1) \* 1000);  
    \})(j);  
\}