整理JavaScript高级基础知识

整理JavaScript高级基础知识

因为空余时间很多..所以博客更新频率得相对频繁些..


原型以及原型链

考察原型以及原型链:

var object = {}
object.__proto__ ===  Object.prototype  // 为 true

var fn = function(){}
fn.__proto__ === Function.prototype  // 为 true
fn.__proto__.__proto__ === Object.prototype // 为 true

var array = []
array.__proto__ === Array.prototype // 为 true
array.__proto__.__proto__ === Object.prototype  // 为 true

Function.__proto__ === Function.prototype // 为 true
Array.__proto__ === Function.prototype // 为 true
Object.__proto__ === Function.prototype // 为 true

true.__proto__ === Boolean.prototype // 为 true

Function.prototype.__proto__ === Object.prototype // 为 true

this

考察 this:

function fn(){
    console.log(this)
}
new fn()

new fn() 会执行 fn,并打印出 this,请问这个 this 有哪些属性?这个 this 的原型有哪些属性?

this 自身没有属性(只有一个隐藏的 proto 属性)

this 的原型是 fn.prototype,只有一个属性 constructor,且 constructor === fn(另外还有一个隐藏属性 proto,指向 Object.prototype)


JSON

考察JSON

JSON 和 JavaScript 是什么关系?

JSON 和 JavaScript 的区别有哪些?

他们的关系:

JSON 是在某一些方面借鉴了JavaScript的一种轻量级的数据交换格式,是一门新语言。

除了 JavaScript 基本数据类型中的 undefined 、symbol,复杂类型中的 function,其他的数据类型在 JSON 中都有。

他们的区别有:

JSON 中的字符串必须用双引号括起,JavaScript 中字符串单双引号都可以;

JSON 中没有变量,所以不能引用,JavaScript中有变量,可以引用;

JSON 中没有原型链,JavaScript有原型链;


MVC

前端 MVC 是什么?

请用代码大概说明 MVC 三个对象分别有哪些重要属性和方法。

前端MVC是什么

MVC 是一种代码组织形式,他把代码依据功能的不同划分成三个部分,分别是Model、Controller、View。

View代表视图

Model代表对数据的操作(存储和获取等)

Controller代表了View和Model两者之间的交互逻辑以及其他。

他们之间的相互作用是这样的:

用户对View视图做出了操作,监听着View视图的controller接收到了View的变化通知,然后按需求去调用Model,Model向server发出请求;server返回响应给Model,Model返回数据给Controller,Controller根据接收到的数据更新View视图。

代码示例

View 主要接受一个选择器,获取需要监听的区域,然后返回一个对象给 controller 操作、更新:

window.View = function(selector){
    return this.document.querySelector(selector)
}

Model 主要负责数据库的初始化、数据的存储和获取,所以他的重要属性应该要要有 init 、fetch 、save:

window.Model = function(options){
    //通过传入参数获取需要操作数据库
    var resourceName = options.resourceName
    return {
        //初始化数据库
        init:function(){},

        //获取数据:
        fetch:function(){},

        //保存数据
        save:function(){}
        }
}

Controller 负责监听和更新 view,调用 model ,接受操作 model 返回的数据,所以他要有一个 init 接收传入的 view 和 model ,负责 model 的调用 和 执行绑定事件函数 bindEvents():

window.Controller = function(options){

    var init = options.init

    var object = {
        view:null,
        model:null,
        init:function(view,model){
            this.view = view
            this.model = model
            this.model.init()
            init.call(this,view,model)
            this.bindEvents.call(this)
        },
    }

    //通过遍历传入的参数  加入函数到object 中,处理其它事务
    for(let key in options){
        if(key !== "init"){
            object[key]=options[key]
        }
    }
    return object
}

在 ES5 中如何用函数模拟一个类?

考察面向对象编程:

function Human(id,hp){
    this.id = id
    this.hp = hp
}
Human.prototype = {
    constructor:Human,
    walk:function(){ /**/ } ,
    species:function(){ /**/ } ,
    useTools:function(){ /**/ } ,
}

Promise

考察 Promise 的用法:

用过 Promise 吗?举例说明。

有,在使用 leanCloud 数据库的时候,我通过调用一个 leanCloud 的 API :fetch 函数获取数据库的数据,这个函数被调用后,返回一个 Promise 对象;这个 Promise 对象有一个 then 属性,他接受两个回调函数作为参数,一旦数据获取成功(resolve),则把数据传入 then 后的第一个函数,对数据进行相对操作;如果数据获取失败(reject),则执行第二个函数。

如果要你创建一个返回 Promise 对象的函数,你会怎么写?举例说明。

function promise(){
    return new Promise((resolve,reject) => {
        console.log(‘this\‘s Promise begin‘)
        resolve(10)
    })
}
promise().then((value)=>{
    console.log(value)
    console.log(‘that\‘s Promise end‘)
})

原文地址:https://www.cnblogs.com/No-harm/p/9688729.html

时间: 2024-10-12 04:34:15

整理JavaScript高级基础知识的相关文章

[HTTP] 高级基础知识整理

HTTP 高级基础知识 整理 HTTP 高级基础知识,包括 Cookie / Session / localStorage / sessionStorage / Cache-Control / Expires / Etag 等 Cookie cookie :wiki Cookie(复数形态Cookies),又称为"小甜饼".中文名称为"小型文本文件",指某些网站为了辨别用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密) -wiki coo

javascript的基础知识及面向对象和原型属性

自己总结一下javascript的基础知识,希望对大家有用,也希望大家来拍砖,毕竟是个人的理解啊 1.1 类型检查:typeof(验证数据类型是:string) var num = 123; console.log(typeof num); // 1.2 in 运算符 作用:判断指定属性是否存在于指定的对象中. 如果指定的属性存在于指定的对象中,则 in 运算符会返回 true. 语法: 属性 in 对象 返回值:true 或者 false 示例: var obj = { age: 18 };

[设计模式整理笔记 一] 基础知识

[设计模式整理笔记 一] 基础知识 [导读] [设计模式整理笔记 一] 基础知识 [设计模式整理笔记 二] 简单工厂模式(Simple Factory) [设计模式整理笔记 三] 工厂模式(Factory) [设计模式整理笔记 四] 抽象工厂模式(Abstract Factory) [设计模式整理笔记 五] 创建者模式(Builder) [设计模式整理笔记 六] 工厂模式与创建者模式总结 [设计模式整理笔记 七] 原型模式(ProtoType) [设计模式整理笔记 八] 单例模式(Singlet

JavaScript 之基础知识

JavaScript 基础知识 JavaScript 是属于网络的脚本语言! JavaScript 被数百万计的网页用来改进设计.验证表单.检测浏览器.创建cookies,以及更多的应用. JavaScript 是因特网上最流行的脚本语言. JavaScript 很容易使用!你一定会喜欢它的! JavaScript 简介 在数百万张页面中,JavaScript 被用来改进设计.验证表单.检测浏览器.创建cookies,等等等等.JavaScript 是因特网上最流行的脚本语言,并且可在所有主要的

[JavaScript]ES5基础知识总结

1.JavaScript是一门动态语言,ES6的出现弥补了Js在大型项目上的乏力(有了"类"). 以下是关于ES5的基础知识: 2. JavaScript 与C++或Java 这种传统的面向对象语言不同,它实际上压根儿没有类.该语言的一切都是基于对象的,其依靠的是一套原型(prototype)系统.而原型本身实际上也是一种对象. 3. 封装:封装概念常由两部分组成:(1)相关的数据(用于存储属性)(2)基于这些数据所能做的事(所能调用的方法) 4. 在JavaScript 中,还有一种

JavaScript语言基础知识总结

1: JavaScript  DOM的基本操作: 2:JavaScript变量的用法 3:JavaScript函数基础 4:JavaScript流程语句 5 : JavaScript数据类型 6:JavaScript数组的应用 7:JavaScript运算符 8:JavaScript正则表达式 9:JavaScript字符串操作函数 10: window 操作对象

JavaScript入门基础知识总结(1)

/* JavaScript基础学习总结 *******该总结用DW写作,为了调试方便,将影响测试的部分以注释形式写出****/ //1.如何放置JavaScript,可以这样实现 //<html> //<body> //<script type="text/javascript">这里的写法是为了让老的游览器能够识别 //这里写JavaScript语句 //如: document.write("hello world");//在页

Javascript入门基础知识和在HTML中的引用方式以及与JAVA之间的关系

JavaScript的基本语法: 一.执行顺序 JavaScript程序是按照出现在HTML文档中出现的顺序逐行执行的,如果需要在整个HTML文档中执行,最好将其放在HTML文件标签中.某些代码,如函数体内的代码,不会被立即执行,只有当所在函数被其他程序调用时,该代码才会被执行. 二.区分大小写 JavaScript是严格区分大小写的.例如str和Str这是两个完全不同的变量. 三.分号和空格 在JavaScript中,语句的":"是可有可无的,但大家最好每一句末尾都加上":

JavaScript入门基础知识总结(3)

/* JavaScript基础学习总结 *******该总结用DW写作,为了调试方便,将影响测试的部分以注释形式写出****/ //所有测试以alert()函数显示 //1.JavaScript特殊字符 //在JavaScript中你可以用反斜杠来表示一个特殊字符,来看例子 //    代码     输出 //    \'     单引号 //    \"     双引号 //    \&     和号 //    \\     反斜杠 //    \n     换行符 //    \r