js编程基础知识一

一、语言设计思路

c基本语法

借鉴java数据类型和内存管理

借鉴scheme语言的函数，函数是"第一等公民"

借鉴self的prototype原型机制实现继承

javascript = 函数式编程 + 面向对象编程

二、面向对象基本规则

1、对象：属性跟方法的综合体

2、不存在独立的函数|属性 所有的函数必须是某个对象的方法|属性

3、prototype 原型编程语言 基本规则

所有的函数都是对象

对象会记住他的原型

当请求访问对象的某个方法，无法响应时，会把请求委托给他自己的原型 =》 原型链

三、作用域

指的是对某一变量||方法有访问权限

四、函数声明与函数表达式

js的执行规则：先定义，后执行

函数的执行规则：当我们调用一个函数[fn()]  首先会去栈中检索是否有定义fn的变量

有： 根据fn变量存储的内存地址找到对应的内存空间，如果fn变量没有存储内存地址，就去堆中找fn的引用

function fn() {
  console.log(1)
}
fn() // 1
var fn = function() {
  console.log(2)
}

没有： 堆中找fn的引用
五、闭包

闭包就是能访问自身作用域以外的变量

六、this

1、this的本质就是一个对象  =》对象    对象是属性跟方法的综合体

2、全局环境下的this =》 window对象

3、对象方法中的this =》 作为对象的方法调用 方法里面的this所指向的就是当前这个对象

4、事件函数中的this =》 触发当前事件的Element对象

5、apply call 中的this =》 改变函数原本this的指向 

函数对象.apply()

函数对象.call()

改变当前函数对象里面 this原本的指向

6、bind

a、bind作为函数对象的方法

b、作为函数对象调用bind的方法  不会立即调用当前函数对象。会返回一个新的函数，此时新函数与函数对象是一样的。此时函数对象中this绑定了bind函数中的第一个参数

7、构造函数中的this

七、正则表达式

a、正则的基本规则

RegExp：/(模式)/(修饰符)   // 字面量    字符串

new RegExp((模式), (修饰符))  //

1、[]    一个字符的范围

2、^$   

3、默认区分大小写

4、i修饰符   让正则模式不区分大小写

5、\d  等价于[0-9]

6、{number}  设置匹配字符数量 

7、\w 等价于 [0-9 a-zA-Z]

8、+ 代表1-N位

9、.(点) 代表任意一个字符

10、？ 要么没有，要么出现一次

11、* 代表0-n个字符

12、g 修饰符 全局匹配

b、字符串的正则方法

search()  检索字符串中与正则表达式匹配的子字符串，并返回子字符串在字符串中的索引

replace(RegExp, function(a, b){  // a是匹配到的字符，b是正则中匹配到的字符里的子表达式的内容

  return 

}) 

match

split

 c、正则的方法

var user = "{{1007}},{{1008}},{{1009}},{{1010}}"

var exp = /\{\{.+\}\}/g

var result

while(result = exp.exec(user) !== null) {

  console.log(result[0]) // result[0] 匹配的字符串

  console.log(result[1])  // result[1] 匹配正则子表达式匹配的子字符串

}

d、模板引擎实现

八、面向对象编程思想

1、prototype: 函数对象的属性

2、普通函数与构造函数的区别

相同点：

a、都是在堆中开辟内存空间

b、函数对象

不同点：

构造函数  创建实例

普通函数  调用

构造函数首字母大写

3、constructor 属性

4、对象分类

a、本地对象

Object Function Array Boolean Number String Date RegExp Error......

b、内置对象(不需要new的对象)

Math 

全局对象 Global(js中实际上并不存在这个东西，只是对全局对象的称呼)

c、宿主对象

BOM  浏览器对象模型  window

DOM  文档对象模型  document Element对象 Attribute对象 Event对象

自定义对象

5、原型链探索

function Person(name, age) {

  this.name = name;

  this.age = age;

}

Person.prototype = {

  eat: function () {

    console.log(this.name + '正在吃饭')

  },

  sang: function () {

    console.log(this.name + '正在唱歌')

  }

}

var m = new Person('max', 30)

function Student(name, age) {

  Person.call(this, name, age)

}

var w = new Student('呵呵哒', 15)

console.log(w.age)

a、继承

b、__proto__ 每一个对象拥有的属性 指向的是当前对象的构造器的原型对象

c、Function 与 Object之间的关系

Object.prototype.work = {

  console.log('1111111')

}

function fn() {

  

}

fn.work()

d、

var obj = {}

console.log(obj.__proto__)

function fn() {}

console.log(fn.prototype) // 函数默认的原型对象指向 {}(构造函数  原型对象)

console.log(fn.__proto__) //  (将fn当作对象，查看fn的构造器关联的原型对象)

console.log(Object.__proto__)  // function

console.log(Object.prototype) // object

console.log(Object.__proto__ === fn.__proto__)  // true 

console.log(Object.__proto__ === Function.prototype) // true

console.log(Function.prototype.__proto__ === Object.prototype) // true

c、面试题

Object.prototype.a = function () {

  alert(1)

}

Function.prototype.b = function () {

  alert(2)

}

function fn () {}

fn.a()  // 1

fn.b()  // 2

fn是如何访问到Object.prototype的，请看下图：

var f = new fn()

f.b()  // 报错

f.a()  // 1

f是如何访问到Object.prototype的，请看下图：