Javascript面向对象精要读书笔记

roadtogeek 发布于2019-08-20 18:30 / 3301人阅读

摘要：面向对象精要读书笔记下面代码的实际执行过程是什么使用原始值和原始封装类型是有区别的因为是被解析成一个对象的，所以肯定是真的函数是对象，函数有两种字面形式，第一种是函数声明，以关键字开头后面跟函数名字。

Javascript面向对象精要读书笔记

1、下面代码的实际执行过程是什么？

var name = "fan"
var str = name.charAt(0)     
console.log(str)

var name = "fan"
var temp = new String(name)
var str = temp.charAt(0)
temp = null
console.log(temp)

2、使用原始值和原始封装类型是有区别的

var flag = new Boolean(false)
if(flag){
    console.log(flag)
}

因为flag是被解析成一个对象的，所以肯定是真的

3、函数是对象，函数有两种字面形式，第一种是函数声明，以function关键字开头后面跟函数名字。

function add(){
    //...
}

第二种形式是将函数作为一个值赋值给变量

var add = function(){
    
}

函数声明会被提升到上下文顶部，可以先使用再定义

var result = add()
function add(){
    //...
}

而函数表达式仅能通过变量引用，因此是没有办法提升的。所以下面会报错

var result = add()
var add = function(){
    //...
}

4、函数的length属性表示该函数的期望参数个数，实现一个函数，求其接受任意数量的参数并返回他们的和

function sum(){
    var result = 0,
        i = 0,
        l = arguments.length
    while(i < l){
        result += arguments[i]
        i++
    }
    return result
}

5、函数重载的理解，下面的函数输出什么？并解释下。

function sayHello(name){
    console.log(name)
}

function sayHello(){
    console.log("default msg")
}

sayHello("fan")

解释：

var sayHello = new Function("name", "console.log(name)")

var sayHello = new Function("console.log("default")")

sayHello("fan")

可以利用参数的个数来模拟函数的重载

6、改变函数的this。

1、call()方法

function sayHi(context){
    console.log(context + ":" + this.name)
}

var person1 = {
    name: "fanchao"
}

var person2 = {
    name: "陈冠希"
}

var name = "小姐姐"

sayHi.call(this, "global")
sayHi.call(person1, "person1")
sayHi.call(person2, "person2")

这里是显示的指定this的值，并不是让javascript引擎去自动指定this

2、apply()方法

function sayHi(context){
    console.log(context + ":" + this.name)
}

var person1 = {
    name: "fanchao"
}

var person2 = {
    name: "陈冠希"
}

var name = "小姐姐"

sayHi.apply(this, ["global"])
sayHi.apply(person1, ["person1"])
sayHi.apply(person2, ["person2"])

apply基本上和call的方式是一样的，就是接受的第二个参数不一样，是以数组的形式传入函数的，call是需要有多少就要以展开的方式传入参数例如：

xxxxFun.call(xxObj, param1,param2,...)

3、bind()方法

bind方法是ECMAscript 5中的方法，和之前的call和apply有点不一样

function sayHi(context){
    console.log(context +  ":" + this.name)
}

var person1 = {
    name: "fanchao"
}

var person2 = {
    name: "陈冠希"
}

//为person1创建一个方法sayHiPerson1
var sayHiPerson1 = sayHi.bind(person1)
sayHiPerson1("person1")

// 为person2创建一个方法sayHiPerson2
var sayHiPerson2 = sayHi.bind(person2,"person2")
sayHiPerson2()
// 因为this已经绑定给了person1，所以name还是person1的
person2.say = sayHiPerson1
person2.say("person2")

sayHiPerson1方法没有绑定参数，所以自己还是要在调用的时候传参数

sayHiPerson2不仅绑定了this指向还绑定了第一个参数。参数的绑定类似call方法。
一个好的食用链接，给个star呗

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/84607.html

《JavaScript面向对象精要》读书笔记

摘要：解除引用的最佳手段是将对象变量设置为。字面形式允许你在不需要使用操作符和构造函数显示创建对象的情况下生成引用值。函数就是值可以像使用对象一样使用函数因为函数本来就是对象，构造函数更加容易说明。 JavaScript（ES5）的面向对象精要标签： JavaScript 面向对象读书笔记 2016年1月16日-17日两天看完了《JavaScript面向对象精要》（参加异步社区的活动送...

GitCafe 2019-08-19 17:26 评论0 收藏0
JavaScript面向对象精要(二)

摘要：使用时，会自动创建对象，其类型为构造函数类型，指向对象实例缺少关键字，指向全局对象。构造函数本身也具有属性指向原型对象。在JavaScript面向对象精要(一)中讲解了一些与面向对象相关的概念和方法，这篇讲讲原型和继承。构造函数和原型对象构造函数也是函数，用new创建对象时调用的函数，与普通函数的一个区别是，其首字母应该大写。但如果将构造函数当作普通函数调用（缺少new关键字...

wayneli 2019-08-21 10:32 评论0 收藏0
JavaScript面向对象精要(一)

摘要：使函数不同于其他对象的决定性特性是函数存在一个被称为的内部属性。其中，是一个布尔值，指明改对象本身是否可以被修改值为。注意冻结对象和封印对象均要在严格模式下使用。数据类型在JavaScript中，数据类型分为两类：原始类型：保存一些简单数据，如true，5等。JavaScript共有5中原始类型： boolean：布尔，值为true或false number：数字，值...

hiYoHoo 2019-08-21 10:33 评论0 收藏0
《JavaScript 权威指南》读书笔记 1 - 简介

摘要：原文第一章主要介绍的大概情况基本语法。通过和来引用对象属性或数组元素的值就构成一个表达式。原文：https://keelii.github.io/2016/06/16/javascript-definitive-guide-note-0/ 第一章主要介绍 JavaScript 的大概情况、基本语法。之前没有 JavaScript 基础的看不懂也没关系，后续章节会有进一步的详细说明...

sydMobile 2019-08-19 18:36 评论0 收藏0