Javacript 学习笔记
一.初探
javacript 学习无法是围绕着对象和属性两个方面来兜圈子，万变不离其宗。
在js中，能点出来的，或者中括号里面的必然是属性（方法）。数组除外。
对象调用属性！
对象调用属性！
对象调用属性！
整个js翻来覆去都在围绕这个事情做文章。
对象调用属性有两种方式：
1.直接点 window.onload 默认是null
2.window[onload] = window[null]=undefined
二.语言特点
是一个解释性语言，解释到哪里就执行到哪里，所以往往不会在一个地方等待，而是先把所有的代码执行完了在说。
比较灵活：
1.可以动态给对象添加属性，或者给属性赋值
2.只要你愿意，随时随地可以引入外部的js脚本，并且立即执行
三.回调函数
一句话概括：回调函数就是把一个函数当做参数，传入另一个函数中，传进去的目的仅仅是为了在某个时刻去执行它
函数必须打一个括号才能执行。
比如：
$(function(){
})
$( )
就是一个函数，打了括号，
function(){
}
就必须执行
真相：
var $ = function(callback){
callback()
}
egg：
var $ = function(id){
return {
element : document.getElementById(id) ,
on : function(event,callback){
this.element['on' + event] = callback;
}
}
}
如果js给dom添加一个点击事件，一般会这样写
dom.onclick = function(){
}
或
dom['onclick'] = function(){
}
调用egg：
window.onload = function(){
$('box').on('click',function(){
$('box').element.style.background = 'green';
});
}
四.数组
三大特性：
1.一般编程语言数组的索引只能是数字，js数组中，它的索引可以是任意类型
2.它是动态的，扩容方便
3.可以放任何对象，也可以放函数，比如：arr[3]();
赋值：扩容赋值，也可以用push（）
常用方法：push() pop() slice()：复制
数组转字符串：ids.join(',') //转换成逗号分隔的字符串
五.Json
一个轻量级的数据交换格式，是一系列键值对的集合，用逗号分隔
js对象转成json格式字符串：
var person = {'name' : 'Jack'}
alert(JSON.stringify(person));
json字符串转成js对象
console.log(JSON.parse("{\"name\":\"Jack\"}"));
获取js对象属性详情
var obj = {
message : 'Hello JavaScript!'
};
console.log(Object.getOwnPropertyDescriptor(obj,'message'));
obj里面有一个属性message，而message又有四个描述性的东西，分别是configurable（可配置），enumerable（可枚举），value（值），还有 writable（可写入）。这四样东西，专业术语叫做属性描述符，或者数据描述符。目前我们看到的数据描述符都被赋予了默认值，我们也可以通过defineProperty方法对其进行个性化配置。
比如，我们把message设置为只读：
var obj = {
message : 'Hello JavaScript!'
};
console.log(Object.getOwnPropertyDescriptor(obj,'message'));
Object.defineProperty(obj,'message',{
writable:false
});
obj.message = 'haha';
alert(obj.message);
修改无效，值不会变，严格模式下会报错（加一行代码：'use strict' ）
六.闭包
闭包就是在函数被创建的时候，存在一个私有作用域，并且能够访问所有的父级作用域。因此理论上讲，任何函数都是一个闭包。
从应用的角度来看，闭包可以讲函数或者对象的私有数据暴露出去，而不影响全局作用域。
function house(){
var footBall = '足球';
/* 客厅 */
function livingRoom(){
var table = '餐桌';
var sofa = '沙发';
alert(footBall);
}
/* 卧室 */
function bedRoom(){
var bed = '大床';
}
livingRoom();
}
house();
函数house是一个闭包，里面又定义了两个函数，分别是livingRoom客厅，和bedRoom卧室，它们各自形成一个自己的闭包。对它们而言，父级作用域就是house。
如何将私有数据暴露出去
1.定义一个全局变量。 缺点:全局作用域比较敏感，一不小心就会出现变量名重复的问题
2.js函数也是一个数据类型，你可以把它看成和int，float一样的东西，那么既然int可以当做函数的返回值，函数当然也可以！
请记住以下两句话：
如果函数被当做参数传进去了，它就是所谓的回调函数
如果函数被当成返回值return出去了，它就是把一个闭包return出去了
egg：
var test = function(){
var i = ;/* 定义一个函数将变量i暴露出去*/
var get = function(){
return i ;
}
return get; //将函数暴露出去
}
function test2(){
var fn= test();//接收test暴露出来的函数
alert(fn()); //获得test中的私有数据
}
test2();// 10
讲私有数据包装成json对象
var test = function(){
var apple = '苹果';
var pear = '梨子';
/* 定义一个函数将水果暴露出去*/
var getFruit = {
apple : apple ,
pear : pear
}
return getFruit; //将对象暴露出去
}
function test2(){
var getFruit = test();//接收test暴露出来的函数
console.log(getFruit);
}
test2();
var 紫金葫芦 = function(id){
var domElement = document.getElementById(id);
var returnObject = {
domElement : domElement ,
backgroundColor : function(color){
domElement.style.backgroundColor = color;
},
click : function(fn){
domElement.onclick = fn;
}
};
return returnObject;
}
这些方法是不是和jQuery有点类似呢？
七.js类库
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<title></title>
<script>
(function(win){
var miniQuery = function(selector){
var miniQuery = document.getElementById(selector); return {
obj : miniQuery , //将dom元素保存起来，再返回给你
// ------------------------ css 相关 ------------------------//
backgroundColor : function(color){
this.obj.style.backgroundColor = color;
}
}
} win.$ = miniQuery; })(window); var $box = $('box');
$box.backgroundColor('red');
</script>
</head>
<body>
<div style='padding: 50px;display:inline-block;background: blue;' id='box'></div>
</body>
</html>
学习参考地址：http://www.xiaotublog.com/
Javacript 学习笔记的更多相关文章
- js学习笔记：webpack基础入门（一）
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- PHP-自定义模板-学习笔记
1. 开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ...
- PHP-会员登录与注册例子解析-学习笔记
1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...
- 2014年暑假c#学习笔记目录
2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...
- JAVA GUI编程学习笔记目录
2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- CSS学习笔记
CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...
- HTML学习笔记
HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...
- DirectX Graphics Infrastructure(DXGI):最佳范例 学习笔记
今天要学习的这篇文章写的算是比较早的了,大概在DX11时代就写好了,当时龙书11版看得很潦草,并没有注意这篇文章,现在看12,觉得是跳不过去的一篇文章,地址如下: https://msdn.micro ...
随机推荐
- python django 实现验证码的功能
我也是刚学Python Django不久很多都不懂,所以我现在想一边学习一边记录下来然后大家一起讨论! 验证码功能一开始我在网上找了很多的demo但是我在模仿他们写的时候,发现在我的版本上根本就不能 ...
- 网页web前端学习技巧
1. 写js效果时一定要注意先分析好效果的行为,尽量用最简单通用性的代码.分析步骤可以是1.先把要实现的功能一步一步的写在纸上(即自然语言)2.再根据自然语言翻译成机器语言,用jquery写的代码一定 ...
- 基于Spring的Appium配置应用
本文主要是讲述,使用Spring框架,优化Appium的Driver调用,并将写在代码里的大量配置参数定义到配置文件当中,还可灵活的控制调用AndroidDriver还是IOSDriver. Spri ...
- VR全景加盟-全景智慧城市携万千创业者决战BAT
在所谓互联网思维走到末路.可穿戴设备基本昙花一现的大环境下,很多互联网人员转战VR市场,自然喜欢用互联网思维来考虑.笔者认识一些投资界人士,在谈到投资时,他们经常就问以下几句话:2B还是2C?将来有多 ...
- Ubuntu怎样进行自由截图操作
全屏截图 1. 很简单,键盘上右上角都有一个 Print Screen按键,敲一下,全屏截图操作完成. 自由截图 1. 此种方式很简单,打开系统设置->键盘,进入shortcuts选项 2. 点 ...
- 刨根究底字符编码之七——ANSI编码与代码页(Code Page)
ANSI编码与代码页(Code Page) 一.ANSI编码 1. 如前所述,在全世界所有国家和民族的文字符号统一编码的Unicode编码方案问世之前,各个国家.民族为了用计算机记录并显示自己的字符, ...
- ORACLE聚合函数细节
select * from emp order by mgr; 概要 select count(1), --14 sum(1), --14 count(*), --14 count(distinct ...
- 【JAVAEE学习笔记】hibernate03：多表操作详解、级联、关系维护和练习:添加联系人
一.一对多|多对一 1.关系表达 表中的表达 实体中的表达 orm元数据中表达 一对多 <!-- 集合,一对多关系,在配置文件中配置 --> <!-- name属性:集合属性名 co ...
- 侯捷STL学习(四)--allocator和容器时间的实现关系
第十一节 分配器 分配器的好坏影响到容器的性能 operator new()里面调用malloc D:\Program Files (x86)\Microsoft Visual Studio 12.0 ...
- 什么是 html 标签，html 实体
为什么需要转换 更简了,因为有时候我们需要在浏览器页面中显示 html 标签,然而直接输出<script>alert(1)</script>,在浏览页面时将会被当作 html ...