读javascript语言精髓笔记

baukh789 发布于2019-08-23 10:49 / 278人阅读

摘要：对象默认值填充对象属性不存在时，使用运算符填充属性不确定时避免报错当检索一个的值时，可以通过运算符来避免错误。例报错先检索是否为，后避免执行后面报错检测对象中是否存在该属性，不会查找该对象的原型链。

对象 默认值填充

对象属性不存在时，使用||运算符填充：obj.name||"lpp"

object属性不确定时避免报错

当检索一个undefined的值时，可以通过 &&运算符来避免错误。
例：

let obj ={};
obj.name //undefined
obj.name.frist //报错
obj.name && obj.name.frist //先检索 obj.name是否为undefined ，false后避免执行后面报错

hasOwnproperty

检测对象中是否存在该属性，不会查找该对象的原型链。

最小化使用全局变量

在全局创建空的对象

var MYAPP = {}; //让该空对象作为唯一的全局对象
MYAPP.WriteCode = {
    //babala
}

最小化使用全局变量可以减少全局污染、降低和其他库框架的重名互相影响

给类型添加方法

Object.prototype可以给所有构造函数对象添加方法

Object.prototype.showA = function () {
    console.log(this.a)
}
let o = {a : 1};
o.showA(); //1
 //届时，想到了jquery里的封装
  $(el).on("click",function(){
    console.log(1)
 })

尝试实现：

首先对象是一个dom对象，其次声明了一个on函数，里面两个参数分别是事件和匿名函数;
那么先从dom对象入手，给该函数添加方法必须找到该对象实例的构造函数，在控制台输入 document.__proto__找到 HTMLElement 再比如

"str".__proto__ ： String //这样就找到该对象实例的构造函数
HTMLElement.prototype.on = function(evt,fun){
   this[evt] = fun;
}
el.on("onclick",function(){
    console.log("balabla");
})

模块 通过函数和闭包来构造模块

模块模式的一般形式是：一个定义了私有变量和函数的函数，利用闭包创建可以访问私有变量和函数的特权函数；最后返回这个特权函数，或者把他们保存到一个可访问的地方。

利：摒弃全局变量减少全局变量污染、安全促使信息隐藏、让思路清晰明了

例():

//做饭  foodMaterial spice为私有属性
let cook = function(){
    let FoodMaterial = "Tomatoes"; //食材：西红柿
    let Spice = "食用盐"; //作料：食用盐
    return {
        buy:function(){
            console.log("购买" + FoodMaterial + "和" + "Spice" );
        },
        doFood:function(){
            console.log(`开始做${FoodMaterial}`);
        }
    }
}
let o = cook();
o.buy();//购买Tomatoes和Spice
o.doFood();//开始做Tomatoes

突然想吃肉，不吃西红柿了

//做饭 
let cook = function(){
    let FoodMaterial = "Tomatoes"; //食材：西红柿
    let Spice = "食用盐"; //作料：食用盐
    return {
        buy:function(){
            console.log("购买" + FoodMaterial + "和" + "Spice" );
        },
        doFood:function(){
            console.log(`开始做${FoodMaterial}`);
        },
        setFood:function(food){
            //未传参则不执行赋值
            food && (FoodMaterial = food);
        }
    }
}
let o = cook();
o.setFood("肉");
o.buy();    //购买肉和Spice
o.doFood();//开始做肉

可以使用传参的形式改变函数内的变量

专线服务私有云 javascript精髓 javascript学习笔记 javascript怎么读 javascript读二进制

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

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

说说我的web前端之路,分享些前端的好书

摘要：推荐高性能网站建设指南高性能网站建设进阶指南理由在读完前几本书之后我们对前端的性能和自己的代码的效率已经达到相当的高度了，然后我们在接触一些前端工程师的一些精髓。　　WEB前端研发工程师，在国内算是一个朝阳职业，这个领域没有学校的正规教育，大多数人都是靠自己自学成才。本文主要介绍自己从事web开发以来(从大二至今)看过的书籍和自己的成长过程，目的是给想了解JavaScript或者是刚...

PascalXie 2019-08-20 17:27 评论0 收藏0
说说我的web前端之路,分享些前端的好书

摘要：推荐高性能网站建设指南高性能网站建设进阶指南理由在读完前几本书之后我们对前端的性能和自己的代码的效率已经达到相当的高度了，然后我们在接触一些前端工程师的一些精髓。　　WEB前端研发工程师，在国内算是一个朝阳职业，这个领域没有学校的正规教育，大多数人都是靠自己自学成才。本文主要介绍自己从事web开发以来(从大二至今)看过的书籍和自己的成长过程，目的是给想了解JavaScript或者是刚...

Integ 2019-08-29 12:48 评论0 收藏0
说说我的web前端之路,分享些前端的好书

摘要：推荐高性能网站建设指南高性能网站建设进阶指南理由在读完前几本书之后我们对前端的性能和自己的代码的效率已经达到相当的高度了，然后我们在接触一些前端工程师的一些精髓。　　WEB前端研发工程师，在国内算是一个朝阳职业，这个领域没有学校的正规教育，大多数人都是靠自己自学成才。本文主要介绍自己从事web开发以来(从大二至今)看过的书籍和自己的成长过程，目的是给想了解JavaScript或者是刚...

sugarmo 2019-08-01 17:01 评论0 收藏0
【转】给年轻的前端程序员提升能力的几条建议

摘要：如果你问一个年轻的前端开发人员，你在今后的年内如何提升自己的能力他可能会说我现在对前端比较熟悉，但我想深入了解，另外现在发展的很快我也想看一下。再举一个例子，我会留意身边的程序员所用的键盘。只有少部分的程序员会买高端的静电容键盘，比如。如果你问一个年轻的前端开发人员，你在今后的 3 年内如何提升自己的能力？他可能会说我现在对 Web 前端比较熟悉，但我想深入了解 AngularJS，...

Ryan_Li 2019-08-20 11:24 评论0 收藏0