`
ynp
  • 浏览: 437928 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js权威指南读书笔记

阅读更多
1、遍历对象属性
var a = {};
a.x = "x";
a.xx = function(){

}
for(var name in a ){
    console.log(name); //x xx
}


2、判断对象类型
var a = new Date;
console.log(typeof a );//object
console.log(a.constructor == Date);//true
console.log(a instanceof Date);//true 等效于上一句

3、如果局部变量不加var 则会成为全局变量

var a = 6;
function test(){
a = 5;
console.log(a); //5
}
console.log(a); //6
test();
console.log(a); //5

4、函数没有块级作用域
无论在函数中那里声明,整个函数中都有它的定义。
---》代码1
var a = 6;
function test(){
console.log(a)// 6
}
test();

---》代码2
var a = 6;
function test(){
console.log(a)// undefined
var a=5;
}
test();

可以看出声明了变量a,则a是在整个test函数起作用的。

所有把函数中的变量放到函数的头部是个很好的习惯。

代码2等同于代码3

---》代码3
var a = 6;
function test(){
var a;
console.log(a)// undefined
a=5;
}
test();

5、js 变量和对象的属性其实是没有根本区别的。全局变量是全局对象的属性。

=========
1、number 类型
js 不区分整型还是浮点类型;
2、string 类型
js没有char类型。
3、number转string

var a = 2.63;
var b = a+""; //方法一
var c = a.toString();//方法二
3、小数转string并保留小数
var a = 2.62;
var d = a.toFixed(1); //2.6
4、字符串转数字
var a = "23.5";
var b = a-0;//方式一  不能+0 那样是字符串连接
var c = parseInt(a);//23  方式二
var d = parseFloat(a); //23.5

==============

1、定义函数
function test1(){
    console.log("test1----");
}

var test2 = function(){
    console.log("test2----");
}

test1();
test2();

2、arguments

function test1(){
    console.log(arguments); //[5, 8, 9]
}

test1(5,8,9);

3、函数作为对象方法的函数

function test1(){
    console.log(arguments); //[5, 8, 9]
}

var test2 = function(){
    console.log("test2----");
}
var obj = {};
obj.test1 = test1;
obj.test2 = test2;

obj.test2(); //test2---
obj.test1(56);//[56]

4、this
---》

function test1(){
    console.log(this.a+ this.b); //3
}


var obj = {a:1,b:2};
obj.test1 = test1;
obj.test1();

---》
var a =4;
var b = 7;

var obj = {a:1,
b:2,
test2:function(){
   console.log(a+ b); //11
}};
obj.test2();
---》
var a =4;
var b = 7;

var obj = {a:1,
b:2,
test2:function(){
   console.log(this.a+this.b); //3
}};
obj.test2();

5、function对象的length属性是指函数的实际形参个数;
arguments 是指实际传递的实参个数;

function test1(e,e){
    console.log(test1.length);//2
    console.log(arguments.length);//3
}

test1(1,2,4);

6、apply、call
指定对象调用方法,可以共享定义的方法。

function test1(e,e1){
    console.log(e+e1);
}

var obj1 = {};
var obj2 = {};
test1.apply(obj1,[1,2]);//3
test1.call(obj2,5,6);//11

7、作为命名空间的调用函数

为避免多个声明变量冲突 可以把变量定义到函数中。

function init(){
var a =0;
var b =1;
}

init();//别忘回调

或者


(function(){
var a =0;
var b =1;
})()

============
1、js构造函数及类定义
function Human(age){
    this.age = age;
    this.getAge = function(){
    console.log(age);
    }
}

var h = new Human(56);
console.log(h.getAge());

2、效率高的js类定义(继承属性)

function Human(age){
    this.age = age;
//    this.getAge = function(){
//    console.log(this.age);
//    }
}
Human.prototype.getAge = function(){
console.log(this.age);  
}

var h = new Human(56);
console.log(h.getAge());

3、判断 属性是继承的属性还是常规的属性
function Human(age){
    this.age = age;
}
Human.prototype.getAge = function(){
console.log(this.age);  
}

var h = new Human(56);
console.log(h.getAge());
console.log(h.hasOwnProperty("age"))//true
console.log(h.hasOwnProperty("getAge"))//false
4、扩展内建类型(最好不要这么写,会造成混乱,可以扩展自己的方法)
String.prototype.showA = function(){
    console.log("---")
}
var a = "ss"
a.showA();//---
console.log(typeof(String.prototype.showA))//function

5、js采用的是原型的继承而不是类的继承
6、实例属性、实例方法、类属性、类方法

// 定义类构造函数
function Circle(radius) {
    //定义实例属性
    this.r = radius;
}

//定义类属性
Circle.PI = 3.14159;

// 定义实例方法
Circle.prototype.area = function() { return Circle.PI * this.r * this.r; }

// 定义类方法
Circle.max = function(a,b) {
    if (a.r > b.r) return a;
    else return b;
}

// 创建类实例
var c = new Circle(1.0);      // Create an instance of the Circle class
c.r = 2.2;                    // Set the r instance property
var a = c.area();             // Invoke the area() instance method
var x = Math.exp(Circle.PI);  // Use the PI class property in our own computation
var d = new Circle(1.2);      // Create another Circle instance
var bigger = Circle.max(c,d); // Use the max() class method

7、通用对象模型 也就是一般需要定义的几个方法

toString()转换成字符串表达形式;
valueOf() 把对象转换成特定数据形式;
equal();比较方法;

8、继承
//父类
function Animal(name){
    this.name = name;
    this.count = 0;
}

Animal.prototype.getName = function(){
    console.log(this.name);
}

var a = new Animal("dog");
a.getName(); //dog

//子类
function Man(sex,name){
    Animal.call(this,name);
    this.sex = sex;
}

Man.prototype = new Animal();//**通过原型继承
Man.prototype.constructor = Man;//**显示设置原型constructor属性

var m = new Man('boy',"jim");
m.getName();//jim
console.log(m.count)//0

9、判断对象类型

var d = new Date();
console.log(typeof d);//object
console.log(d instanceof Object);//true
console.log(d instanceof Date);//true
console.log(d.constructor == Date)//true
console.log(d.constructor == Object)//false

typeof主要用于区分对象和基本数据类型;
区分对象是不是某个类的实例 可以用instanceof

==========
1、尽量不要定义全局变量 ,而应该定义到一个对象中统一管理,用对象模拟实现命名空间
class={};
class.a="aaa"; //定义一个属性
//定义一个方法
class.showA = function(){
console.log(this.a);
}

class.showA(); //aaa

2、加入还有个模块用了class  难免会覆盖上述的calss命名空间
可以分模块定义class

var  moduleA = {};
moduleA.class = {};
moduleA.class.a="aaa"; //定义一个属性
//定义一个方法
moduleA.class.showA = function(){
console.log(this.a);
}
/*或者
moduleA.class = {
a:"aaa",
showA : function(){
console.log(this.a);
}
}
*/

同样可以定义模块B的class
4、//检查模块可用性
var com;//声明全局变量
if(!com || !com.sf){
    throw new Error("com.sf 模块不存在!");
}
5、extjs 的命名空间
//ext的命名空间
Ext.namespace("com.sf");
//检查模块可用性
if(!com || !com.sf){
    throw new Error("com.sf 模块不存在!");
}else{
    console.log("存在");//存在
}

6、闭包创建私有空间,把公有方法导入到命名空间中
//ext的命名空间
Ext.namespace("com.sf");//等同于 var com = {}; com.sf = {};
//检查模块可用性
if(!com || !com.sf){
    throw new Error("com.sf 模块不存在!");
}else{
    console.log("存在");//存在
}

//闭包创建私有空间,把公有方法导入到命名空间中
(function(){
var a = "test";
function showName (){
    console.log(a);
}   
var temp = com.sf;
temp.showName = showName; //导入到com.sf命名空间中
})();

com.sf.showName();//test
console.log(com.sf.a);//undefined 无法获取私有变量

7、划分模块与ext.namespace 影响

Ext.namespace("xxx.i18n");
xxx.i18n.b = "bbb";

console.log(xxx.i18n.a);//aa



if(!xxx)
var xxx = {};

if(!xxx.i18n)
xxx.i18n = {};

//等同于 Ext.namespace("xxx.i18n");

xxx.i18n.a = "aaa";
console.log(xxx.i18n.a);//aaa
console.log(xxx.i18n.b);//bbb
==========
1、客户端javscript中 全局对象时window
var a="nihao";
window.b = "nihao!";//等同于上一句
console.log(window.a);
console.log(a);
console.log(window.b);//nihao!
console.log(b);//nihao!
分享到:
评论

相关推荐

    javascript权威指南笔记

    JavaScript权威指南笔记是深入理解和掌握JavaScript这门编程语言的重要参考资料。这份笔记包含了作者在研读《JavaScript权威指南》过程中的学习体会和理解,旨在帮助读者更有效地掌握JavaScript的核心概念、语法特性...

    javascript参考教程javascript高级教程javascript权威指南(第四版)

    《JavaScript权威指南(第四版)》则是一本详尽的JavaScript学习资料,它涵盖了语言的最新发展,例如ES6及后续版本引入的新特性。这里你可以了解到箭头函数、解构赋值、类与继承、模板字符串、迭代器和生成器等。...

    JavaScript 权威指南(第四版) 读书笔记

    Javascript是无类型、解释型语言 对大小写敏感 html对大小写不敏感 忽略空格符、制表符、换行符(关键字、变量、正则表达式 除外) “;”分号可选择 //单行注释 /*多行注释*/ 标示符 开头必须是字母、下划线、$符号 ...

    《jQuery权威指南》学习笔记之第1章 jQuery开发入门

    在实际学习过程中,通过阅读《jQuery权威指南》第1章并配合测试代码(未提供具体内容),可以更深入地理解和实践上述知识点,逐步掌握jQuery的开发基础。同时,不断练习和应用这些知识,才能真正提升开发技能,实现...

    《jQuery权威指南》学习笔记之第3章 jQuery操作DOM

    在深入探讨jQuery操作DOM的详细知识点之前,先简要介绍一下jQuery。jQuery是一个高效、简洁的JavaScript库,它极大...通过阅读《jQuery权威指南》第三章,你将更深入地理解这些概念,并学会如何在实际项目中有效应用。

    HTML5权威指南 阅读计划-叶糖糖1

    《HTML5权威指南》是一本全面且深入介绍HTML5、CSS和JavaScript的书籍,适合初级到中级前端工程师阅读。本书的特色在于系统性地涵盖了HTML5的各项新特性,包括标记文字、文档分节、表格元素、表单以及自定义input...

    《jQuery权威指南》学习笔记之第4章 jQuery中的事件与应用

    在深入探讨jQuery中的事件与应用之前,我们先要理解jQuery库的基本概念。...在阅读《jQuery权威指南》的第4章时,重点关注上述内容,结合实际项目进行实践,将有助于巩固和深化对jQuery事件处理的理解。

    笔记:读书笔记,读书笔记

    :open_book: 读书笔记 :slightly_smiling_face: :upside-down_face: 买过很多书,也打印过很多电子版的书籍和资料,断断续续的读,杂乱无章。心血来潮,想自己整理一下,希望可以坚持下去,不断学习,不断提升自己。...

    ng2-in-action:《 Angular权威指南》读书笔记-官方源码https

    生活所迫,又沦为全干工程师。 应付应付工作就行了,关于js可以或者Ng原理就不深扣了。

    前端开发书籍推荐与学习路线.docx

    * 推荐书籍:JavaScript 高级程序设计、JavaScript 权威指南、JavaScript 语言精粹 * 学习方法:边实战边记笔记,不要光看,要有方法的快速阅读 三、JavaScript 进阶 * 推荐书籍:《你不知道的 JavaScript》 * ...

    浅谈JS中逗号运算符的用法

    本文的理论知识来自于JavaScript权威指南,我这里做一下整理,或者说叫笔记。 如果你的基础够好的话,完全理解不成问题,但是如果读得有些郁闷的话,可以加我的QQ:76863715 阅读本文的前提是,你能区分什么是表达式...

    Jquery 学习帮助文档

    通过阅读《jQuery权威指南》的读书笔记,我们可以深入理解这些概念,并在实践中灵活应用。jQuery不仅简化了JavaScript代码,还提高了开发效率,是现代Web开发不可或缺的工具。不断学习和掌握jQuery,将有助于提升...

    Reading-Notes:读书笔记们

    学习笔记都在这里了 好好学习,天天向上!生命不息,阅读不止!...HTTP权威指南 Head First Java CSS3揭秘 Linux Command Line 大型网站技术架构核心原理与案例分析 锋利的jQuery JavaScript设计模式与开发实践

    Reading-notes:阅读笔记总结

    最近规划复习鸟叔Linux三,四壳JavaScript学习指南节点JS C底漆加数据结构-2.4学习JavaScript权威指南-2.3 JS学习指南里的推荐阅读Promise应用-2.12算法Leetcode Postfix文档-完成面试总结-2.2 FreeCodeCamp英语口语...

    Oreilly.HTML学习笔记

    Oreilly出版的《HTML and XHTML: The Definitive Guide》是这个领域的权威指南,已经更新到第五版,为读者提供了深入理解HTML和XHTML的全面知识。 HTML是一种标记语言,它的主要作用是定义网页结构,通过不同的标签...

    boutique-books:我读过的一些好书

    b00-阅读笔记 b01-数学 b02-计算机基本理论 《计算机网络》 b03-数据结构与算法 《算法图解》 《学习js数据结构与算法》 《数据结构与算法JavaScript描述》 b04-图形学与可视化 《HTML5 Canvas核心技术》 《WebGL...

    java script

    如"javasript&DHTML.chm"可能涵盖了JavaScript与DHTML(Dynamic HTML)的结合使用,"JavaScript权威指南(英文版).chm"是一本深入学习JavaScript的参考书籍,"jsnote.doc"可能是个人的学习笔记,而"js.pdf"可能是关于...

    玩转html5的canvas画图

    ,最近在研读《html5与css3权威指南》下面对其中最好玩的canvas的学习做下读书笔记与实验。温馨提示:以下所有实验请使用最新版的operacontext:一直觉得这个翻译成“上下文”真够蛋疼的,context是一个封装了很多...

    java学习资料总结2015新

    - **《JavaScript开发王》**、**《JS精彩两百例》** 等书籍涵盖了 JavaScript 的高级用法和实战技巧,对于提高编程水平非常有帮助。 - **《21天学通JavaScript(第2版)》** 和 **《JavaScript动态网页开发案例指导...

Global site tag (gtag.js) - Google Analytics