面试题

HTML行内元素、块状元素、行内块状元素的区别

块级元素：块级大多为结构性标记

  <address>...</adderss>   
  <center>...</center>  地址文字
  <h1>...</h1>  标题一级
  <h2>...</h2>  标题二级
  <h3>...</h3>  标题三级
  <h4>...</h4>  标题四级
  <h5>...</h5>  标题五级
  <h6>...</h6>  标题六级
  <hr>  水平分割线
  <p>...</p>  段落
  <pre>...</pre>  预格式化
  <blockquote>...</blockquote>  段落缩进   前后5个字符
  <marquee>...</marquee>  滚动文本
  <ul>...</ul>  无序列表
  <ol>...</ol>  有序列表
  <dl>...</dl>  定义列表
  <table>...</table>  表格
  <form>...</form>  表单
  <div>...</div>

行内元素：行内大多为描述性标记

  <span>...</span>
  <a>...</a>  链接
  <br>  换行
  <b>...</b>  加粗
  <strong>...</strong>  加粗
  <img >  图片
  <sup>...</sup>  上标
  <sub>...</sub>  下标
  <i>...</i>  斜体
  <em>...</em>  斜体
  <del>...</del>  删除线
  <u>...</u>  下划线
  <input>...</input>  文本框
  <textarea>...</textarea>  多行文本
  <select>...</select>  下拉列表

互相转换

• display:inline;转换为行内元素
• display:block;转换为块状元素
• display:inline-block;转换为行内块状元素

原型与原型链

proto是每个对象都有的一个属性，而prototype是函数才会有的属性!!!

Object.__proto__ === Function.prototype;
Function.prototype.__proto__ === Object.prototype;
Object.prototype.__proto__ === null;

• 题目 1

var A = function() {};
A.prototype.n = 1;
var b = new A();
A.prototype = {
  n: 2,
  m: 3
}
var c = new A();

console.log(b.n);
console.log(b.m);

console.log(c.n);
console.log(c.m);

请写出上面编程的输出结果是什么？

• 题目 2

var F = function() {};

Object.prototype.a = function() {
  console.log('a');
};

Function.prototype.b = function() {
  console.log('b');
}

var f = new F();

f.a();
f.b();

F.a();
F.b();

请写出上面编程的输出结果是什么？

• 题目 3

function Person(name) {
    this.name = name
}
let p = new Person('Tom');

问题1：1. p.proto等于什么？
问题2：Person.proto等于什么？

• 题目 4

var foo = {},
    F = function(){};
Object.prototype.a = 'value a';
Function.prototype.b = 'value b';

console.log(foo.a);
console.log(foo.b);

console.log(F.a);
console.log(F.b);

请写出上面编程的输出结果是什么？

• 题目 1 答案：

  b.n -> 1
  b.m -> undefined;
  c.n -> 2;
  c.m -> 3;

• 题目 2 答案：

  f.a() -> a
  f.b() -> f.b is not a function
  F.a() -> a
  F.b() -> b

• 题目 3 答案
  答案1：Person.prototype
  答案2：Function.prototype

• 题目 4 答案
  foo.a => value a
  foo.b => undefined
  F.a => value a
  F.b => value b

什么是深拷贝？什么是浅拷贝？

简单来说，有两个对象 A 和 B，B = A，当你修改 A 时，B 的值也跟着发生了变化，这时候就叫浅拷贝。如果不发生变化，就叫深拷贝。