日常整理系列——笔试刷题00006

1） CSS 百分比参照问题

当进行百分比设置宽高、内外边距时，所遵循的规则是：

参照父元素宽度的元素：padding margin width text-indent
参照父元素高度的元素：height
参照父元素属性：font-size line-height

特殊：相对定位的时候，top(bottom) left(right) 参照的是父元素的内容区域的宽度与高度，而绝对定位的时候参照的是最近的定位元素包含padding 的高度和宽度

2）以下代码显示结果为：

var x = new Boolean(false);
if (x) {
    alert('Hi');
}
var y = Boolean(0);
if(y) {
    alert('hello');
}

答案：’Hi‘

解析：x为Boolen对象，在if语句里的判断为true，虽然x的值为false，但是作为对象，if会直接判断为true。y为Boolen值，在if里的判断就是false值。所以，若y的值改为 new Boolean(0)时，结果会与不加new的时候相反。

3）以下代码的输出结果是

var f = function g() {
    return 23;
};
typeof g();

答案：Error

解析：typeof f ;结果是function； typeof f(); 结果是 number；如果是typeof g; 结果是undefined；
在JS中，声明函数只有2种方法：
第一种：function foo(){ ... } (函数声明)
第二种：var foo = function () { ... } (等号后面必须是匿名函数，这句是指是函数表达式)
除此之外，类似于var foo = function bar() { ... };这样的统一按照第二种处理，即在函数外部无法通过bar访问到函数，因为这已经变成一个表达式；
如果是typeof g,会返回undefined；但是g()，会先被解析为：首先调用g再解析()从而.抛出异常。

4）在JavaScript中，以下哪些是原始值（primitive value）?

"3"
10
null
[1]

答案：1 2 3

解析：在ECMAScript中，变量可以存放两种类型的值，即原始值和引用值。原始值是存储在栈中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。引用值是存储在堆里的对象，也就是说，存储在变量处的值是一个指针，指向存储对象的内存处。ECMAScript中有5种原始类型，即undefined null number string boolean。故除了最后一个数组其他均是原始值。数组为引用值

4) 简要概述一下cookie localStorage,sessionStorage的区别

特性	Cookie	localStorage sessionStorage
数据的生命期	一般由服务器生成，可设置失效时间，如果在浏览器端生成cookie，默认是关闭浏览器后失效	除非被清除，否则永久保存	仅在当前会话下有效，关闭页面或浏览器后被清除
存放数据大小	4K左右	一般为5MB
与服务器端通信	每次都携带在http头中，如果使用cookie保存过多数据会带来性能问题	仅在客户端（即浏览器）樟保存，不参与和服务器的通信
易用性	需要程序员自己封装，原声的cookie接口不友好	原生接口可以接受，亦可再次封装来对Object和Array有更好的支持

5）小结css中link和@import的区别

页面中使用css的方法主要有3中，行内添加定义style属性值；页面头部内嵌调用和外部链接调用，其中外部引用有两种：link和@import。外部调用css两种方式分别是：

XML/HTML代码：

<link rel="stylesheet" rev="stylesheet" href="css文件" type="text/css" media="all" />

XML/HTML代码：

<style type="text/css" media="screen" />
    @import url('css文件');
</style>

两者区别：

link是XHTML标签，除了加载css外，还可以定义RSS等其他事物；@import属于css范畴，只能加载css
link引用css时，在页面载入时，同时加载；@import需要页面完全载入后加载
link是XHTML标签，无兼容问题；@import是在css2后提出，低版本的浏览器不支持
link支持使用JavaScript控制DOM去改变样式，而@import不支持

补充：@import最优写法
@import的写法一般有下列几种：

@import 'style.css' //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
@import "style.css" //Windows IE4/ NS4, Macintosh IE4/NS4不识别
@import url(style.css) //Windows NS4, Macintosh NS4不识别
@import url('style.css') //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
@import url("style.css") //Windows NS4, Macintosh NS4不识别
由上分析知道，@import url(style.css) 和@import url("style.css")是最优的选择，兼容的浏览器最多。从字节优化的角度来看@import url(style.css)最值得推荐。

6） iframe的使用场景

典型系统结构，左侧是功能树，右侧是一些常见的table或者表单之类的，为了每一个功能，单独分离出来，采用iframe
ajax上传文件
加载别的网站内容，例如Google广告，网站流量分析
在上传图片时，不用flash实现无刷新，
跨域访问的时候可以用到iframe。使用ifame请求不同域名下的资源。