某家笔试题

某家笔试题总结
1：css样式顺序，就近原则；多个class id组合的顺序没有关系

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		.yellow{
			color: yellow;
		}
		.red{
			color:red;
		}
	</style>
</head>
<body>
	<div class="red yellow">hello world!</div>
</body>
</html>



2:substring vs substr
substring(begin_index,end_index);
得到的子串是：begin_index到end_index-1
substr(begin_index,length);
得到的子串长度是：begin_index到length长度的子串，begin_index算第一个
关于子串下标更进一步的讨论
参考：substring vs substr


3:Math.round(parseFloat(‘1.45b’)); // 1
a:pareseFloat先将’1.45b’转换成1.45
b:Math.round()再四舍五入、


4：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
   (function(){
 		return typeof arguments; //object
 	})()

   var f = function c(){
 		return 2;
 	}
 	console.log(typeof f())//number

   (function(x){
 		delete x;
 		return x;
 	})(1); //1

   (function f(){
 		function f(){return 1;}
 		return f();//2
 		function f(){return 2;}
 	})(); 
 	
var foo = {
 		bar : function(){return this.num},
 		num : 1
 	}
 	(function(){
 		return typeof arguments[0]; //number
 	})(foo.bar());	

 foo.bar() //30
  		var foo = {
       x: 20,
        bar: function () {
           var x = 30;
           return this.x;
       }
   };
   foo.bar()//20 	

   function fn(){
		var arr = new Array();
		for(var i = 0; i <3; i++)
		{
			arr[i] = function(){
				return i;
			}
		}
		return arr;
	}
	var arr = fn();
	console.log(arr[0]()); //3
	console.log(arr[1]()); //3
	console.log(arr[2]()); //3

	function fn(){
		var arr = new Array();
		for(var i = 0; i <3; i++)
		{
			arr[i] = function(i){
				return i;
			}(i);
		}
		return arr;
	}
	var arr = fn();
	console.log(arr[0]); //3
	console.log(arr[1]); //3
	console.log(arr[2]); //3

	 var name = 'the windows';
	 var object = {
	 	name : 'my object',
	 	getName : function(){
	 		return function(){
	 			return this.name;
	 		}
	 	}
	 }

	 console.log(object.getName()());  //the windows

	 var name = 'the windows';
	 var object = {
	 	name : 'my object',
	 	getName : function(){
	 		return this.name;
	 	}
	 }
	 console.log(object.getName());  //my object

	 var name = 'the windows';
	 var object = {
	 	name : 'my object',
	 	getName : function(){
	 		var that = this;
	 		return function(){
	 			return that.name;
	 		}
	 	}
	 }

	 console.log(object.getName()());  //my object

	 var scope = "global scope";
	 function checkScope(){
	 	var scope = "local scope";
	 	function f(){
	 		return scope;
	 	}
	 	return f();  //local scope
	 }


	 console.log(checkScope()); //global scope //匿名函数this对象总是指向顶层window

	 var scope = "global scope";
	 function checkScope(){
	 	var scope = "local scope";
	 	function f(){
	 		return this.scope;
	 	}
	 	return f();
	 }
	 console.log(checkScope()); //global scope //匿名函数this对象总是指向顶层window

	  var a = 1;
	 function fn(){
	 	function fn2(){
	 		console.log(a);
	 	}
	 	return fn2;
	 }
	 fn()();//1 //没有局部变量就向上查找全局变量

js数据类型
基本类型：number boolean underfined string null
复杂类型：object

js数组比较
js数组不能直接使用==比较，返回的是false

1
2
3
var a = [1,2,3];
var b = [1,2,3];
a == b; //false

正确的做法是：遍历比较数组内部元素.之前有说使用toString方法来比较，这是万万不妥的，toString会强制转换所有数组内容为string类型，因此无法判断数据类型。

1
2
3
4
5
6
7
8
9
10
function checkArrayEqual(a,b){
 if(a.length !== b.length)
 	return false;
	else{
 	for(var i = 0 ; i <= a.length; i++)
  	if(a[i] !== b[i])
   	return false;
	}
 return true;
}

实现方法temp(‘hello,{name}’, {name : ‘Lucy’})，输出’hello,Lucy’
当时的写法是：

1
2
3
4
5
6
function temp(){
	var a = arguments[0].substring(0,6);
	var b = arguments[1].name;
	console.log(a + b);
}
temp('hello,{name}', {name : 'Lucy'});//hello,Lucy

现在想一想，应该不是出题者的本意吧

写一个响应式布局页面
移动优先 渐进增强

css3 Media Query
device-width device-height
width height
oritation
resolution

css写一个input框，实现foucs功能
我ciao，忘记了placeholder误终身啊，结果就是这么简单。


1
<input type="text" class="inputarea" id="inputarea"  placeholder="f***k world!"/>