js简介

首先介绍了js是一种专门与网页交互而设计的脚本语言。主要由ECMAScript 文档对象模型（DOM） 浏览器对象模型（BOM）三部分组成。分别用来提供核心语言，提供访问和操作网页内容的方法和接口，提供与浏览器交互的方法和接口。

在HTML中使用js

介绍了<script>元素的使用和属性。defer属性--延迟脚本。async属性--异步脚本。

js引用建议全部放在<body>元素中内容的后面。这样，在解析包含js代码之前，页面的内容将完全呈现在浏览器上。而用户也会因为浏览为窗口显示空白页面的时间缩短而感到打开页面的速度加快了。

建议尽可能使用外部文件来包含js代码。优点为可维护性，可缓存（如果页面都使用同一个文件，那么这个文件只需要下载一次就可以了）。 适应未来。

基本概念

区分大小写

标识符：第一个字符必须是一个字母、下划线（_）、或者一个美元符号。其他字符可以使字母、下划线、美元符号和数字。惯例是采用驼峰大小写的格式，也就是第一个字母小写，剩下的每一个有意义的单词首字母大写。

注释：

　　//单行注释

　　/*

　　* 多行注释

　　*/

变量：省略var操作符可以定义一个全局变量，但这不是推荐的做法，因为在局部作用于定义的全局变量很难维护。

　　　可以用一条语句定义多个变量 var message="hi" , found=false , age=29;

数据类型：

　　5中基本数据类型：underfined，null，boolean，number，string      1中复杂数据类型：object

typeof操作符 typeof(message)  、typeof message  、typeof 95

　　"undefined"--如果这个值未定义     "boolean"--如果这个值是布尔值    "string"--如果这个值是字符串    "number"--如果这个值是数值

　　"object"--如果这个值是对象或null    "function"--如果这个值是函数

Undefined类型：在使用变量，但是未对其加以初始化时，这个变量的值就是undefined。

Null类型：Null类型是第二个只有一个值得数据类型，这个特殊的值是null。从逻辑角度上看，null值标识一个空对象指针，这也正是使用tyoepf操作符检测null值会返回‘object’的原因。

Number类型

String类型

　　

Object类型 var o=new Object();

　　

break和continue语句  break语句会立即退出循环，continue语句会退出当前循环，进入下一次循环

判断函数function内传入的参数

变量、作用域和内存问题

基本类型和引用类型的值  5中基本数据类型 undefined、null、boolean、number、string 这5中数据类型是按值访问的，因为可以操作保存在变量中实际的值。引用类型是指保存在内存中的对象，与其他语言不同。js无法直接访问内存中的位置，也就是无法直接操作对象的内存空间。实际操作的是引用而不是实际的对象。为此，引用类型的值是按引用访问的。

访问变量有按值和按引用两种方式，但是参数只能按值访问。

在检测基本数据类型时typeof是非常得力的助手，但是检测引用类型的时候一般会用到  instanceof  

执行环境和作用域

　　全局执行环境被认为是window对象，所以所有的全局环境的变量和方法被作为window的属性和方法创建的。

　　可以延长作用域链

　　没有块级作用域 if for 等大括号内定义的变量可以在外部可以访问到。

垃圾收集   标记清除  和  引用计数

引用类型

引用类型:

Object类型：大多数的引用类型都是object类型，创建object类型有两种方式：一种是使用new操作符，一种是使用对象字面量表示法

　　　　　　var person=new Object(); person.name='Ni';person.age=29;

　　　　　　var person={name:'Ni',age:29};   //推荐

　　　　　　var person={}  于  var person=new Object();相同

Array类型：创建Array类型有三种方式：

　　　　　　1，var colors=new Array()   var colors=new Array(5)    var colors=new Array("red","blue")

　　　　　　2，var colors=Array()   var colors=Array(5)    var colors=Array("red","blue")

　　　　　　3，var colors=[]   var colors=["red","blue"]

　　检测数组:Array.isArray(value){ }

　　增：push ("值")返回数组长度   unshift("值")//数组前端添加并返回数组长度

　　　　splice()方法，最强大的数组方法。主要用途是向数组的中部插入项。

　　　　

　　删：shift()//删除出第一项并返回该项  pop() //删除最后一项并返回该项

　　复：concat()

　　　　

　　检：  reverse()反序查询 sort() 正序

　　　　

　　截：slice() 方法 不影响原数组。

　　　　

位置方法：indexOf()和lastIndexOf()

Data类型：

Function类型：函数内部有两个特殊的对象：arguments（类数组对象）和this

　　　　　　　 最耐人寻味的是prototype属性：保存所有实例方法的真正所在，toString()和valueOf都保存在prototype里面。实现继承时极为重要。

String类型：length属性，

　　　　　　字符方法：charAt()和charCodeAt()

　　　　　　创建新字符串并不会改变原始字符串的方法：slice()  substr()  substring()   接受一或两个参数：第一个参数是开始位置，第二个表示字符串到哪里结束。其中substr第二个参数是指返回字符的个数。另两个是指结束的位置。

　　　　　　位置方法：indexOf()  lastIndexOf()

　　　　　　　　删除前置和后置的空格：trim()方法

　　　　　　　　字符串大小写：转大写toLocaleLowerCase()    转小写toLocaleUpperCase()

eval（）方法：最强大的一个方法  eval（"alert('hi')"） 等价于 alert('hi')

Math对象

面向对象

面向对象：

　　原型模型：每一个函数都有一个prototype属性，这个属性是一个指针，指向一个对象。而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。 理解原型对象：只要创建一个函数对象，在默认情况下，所有原型对象都会获得一个constructor属性，这个属性包含一个指向prototype属性所在函数的指针。

　　hasOwnProperty()方法可以检测一个属性是否存在实例里，只有属性存在于对象实例里中，才会返回true。

继承：实现继承主要是依靠原型链来实现的。原型链的基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。

　　　让原型对象等于另一个类型的实例

　　   寄生组合式继承：最理想的继承方式（待研究）

函数

BOM

window对象

　　Bom的核心对象是window，它表示浏览器的一个实例。在浏览器中，扮演着双重角色，既是用户访问浏览器窗口的一个接口，又是ECMAScript规定的Global对象。location和navigator都是window对象的属性。

窗口关系及框架

窗口位置：screenLeft 和 screenTop属性分别用于表示窗口相对于屏幕左边和上边的位置。

窗口大小：window.resizeTo(300,300)窗口大小调整到300*300

导航和打开窗口：

　　

　　　　

　　　　opener属性保存着打开本窗口的对象。

间歇调用和超时调用

　　在使用间歇调用的时候  var id=setInterval(function(){alert("hello world")},500)  一定要记得clearInterval(id) 不然的话会一直调用。

　　超时调用  setTimeout(function(){alert("hello world")},500) 没必要跟踪超时调用的id，因为每次执行代码之后，如果不再设置另一次超时调用，调用就会停止，一般最佳的模式是使用超时调用来模拟间歇调用。原因是最后一次间隔调用有可能在上一次调用结束之前就会启动。而超时调用会很好的回避这一点。

　　

系统对话框  alert()   confirm()   prompt()

　　

location对象 location是最有用的Bom对象之一，它提供了当前窗口中加载文档的有关信息，还提供了一些导航的功能。即是window的对象也是document的对象。window.location 和document.location引用的是同一对象。location保存了当前文档的信息和还将URL解析为独立的片段

通过location获取传的参数

　　

　　　

位置操作

　　location.assign("http://www.baidu.com");--历史记录中生成一条记录，可返回  location.replace("http://www.baidu.com") --历史记录不生成记录，不可返回

　　  location.reload();--加载本页面可能从缓存中加载。location.reload(true) 直接从服务器中重新加载数据。

navigator对象关于插件

screen对象  window.resizeTo(screen.availWidth,screen.availHeight)

　　

　　

客户端检测

能力检测：这是广泛接受的客户端检测形式。目标不是识别特定浏览器而是识别浏览器的能力

怪癖检测

用户代理检测：此检测是客户端检测的最后一个选择。只要可能，应该优先使用能力检测和怪癖检测。下面是用户代理检测全部代码

　　

　　

　　

　　

　　　

DOM

Dom描述了一个描绘了一个节点数，允许开发人员进行添加、移除和修改页面的某一部分。

if(someNode.nodeType==1){ alert( this node is a element )}

节点关系：每个节点都有一个childNodes属性，其中保存着一个NodeList对象。NodeList是一个类数组的对象，保存一组有序的节点，可以通过位置访问这些节点。

　　var firstChild=someNode.childNodes[0];

　　var secondChild=someNode.childNodes.item[1];

　　var count=someNode.childNodes.length;

　　每个节点都有一个parentNode属性，

　　

　　hasChildNodes()是一个非常有用的方法，存在一个或者多子节点就会返回true。比判断someNode.childNodes.length是否为0要方便的多

操作节点：  appendChild()，向childNodes列表的末尾添加一个节点，返回新增的节点。

　　　　　　insertBefore()方法

　　　　　　

　　　　　　　　replaceChild()方法替换节点接受两个参数是：要插入的节点和要替换的节点。返回已删除的节点。

　　　　　　removeChild()方法删除节点：接受参数为要删除的节点。

Document类型：是window对象的一个属性。因此可以作为全局对象来访问。可以表示HTML页面或者其他基于xml的文档。不过，最常见的引用还是作为HTMLDocument实例的document对象。

　　　　　　

　　　　　　　　重要的方法：getElementById()  (不存在返回Null)   getElementByTagName()  返回一个或多个集合的NodeList

　　　　　　文档写入：write()、writeln()、open()、close()

　　Element类型:

　　　　　　tagName和nodeName返回始终大写

　　　　　　HEML元素：所有HTML元素都是通过HTMLElement类型的子元素表示出来的。HTMLElement类型直接继承自Element并添加了一些属性。

　　　　　　创建元素：1---var Newdiv=document.createElement("div");  document.body.appendChild(Newdiv)

　　　　　　　　　　　2---var div=document.createElement("<div id=\"myNewDiv\" class=\"box\"></div>")

　　　　　　子节点：

　　　　　　　　　　

　　　　　　Text类型：var text=document.createTextNode("hello world")  element.appendChild(text);

Dom操作技术

　　操作表格：下面贴出为<table>元素添加的属性和方法如下：

　　　　　　　　　　

　　　　　　　　　　　　　　

　　　　理解Nod

eList：理解nodelist和“近亲”NamedNodeMap与HTMLCollection，是从整体上理解DOM的关键所在。三个对象都是动态的。每当文档发生改变，都会实时更新。所以三个对象所存信息十分准确。

焦点管理：

　　　　var button=document.getElementById('myButton');

　　　　button.focus();

　　　　alert(document.activeElement===button);  //true

　　　　alert(document.hasFocus());//true

innerText属性：通过该属性读值得时候，会按照由浅到深将所有节点的文本拼接起来。在通过该属性写入值得时候，会将删除元素的所有子节点，插入包含相应文本值的文本节点。火狐浏览器不支持此属性，对应的属性是textContent。

outerText在读值的时候和innerTest属性作用是一样的，在赋值的时候不仅会删除该元素的子节点，会整个替代该元素（不要使用）

document.body.clientWidth  document.body.clientHeight

滚动：

　　

　　　　　　　　

　　

　　

javascript 高级程序设计1--14章重点总结的更多相关文章

  1. JavaScript高级程序设计第14章表单脚本 （学习笔记）

    第十四章 表单脚本 1.阻止默认表单提交 1.提交表单数据 1.使用type=submit提交按钮 2.使用submit():方法 注意:当用户点击提交按钮时,会触发submit事件,从而在这里我们有 ...

  2. 《JavaScript高级程序设计》——第二章在HTML使用JavaScript

    这章讲的是JavaScript在HTML中的使用,也就是<script>元素的属性.书中详细讲了async.defer.src和type四个<script>的属性. 下面是对第 ...

  3. JavaScript 高级程序设计 第5章引用类型 笔记

    第五章 引用类型 一.object类型 1.创建方法: 1.使用new 操作符创建 var person=new object() Person.name=”Nicholasa” Porson.age ...

  4. JavaScript高级程序设计第20章JSON 笔记 （学习笔记）

    第二十章 JSON 1.Json 可以表示三种类型的值: 1.简单值: 表示数值:5  表示字符串:“hello wrold”注表示字符串时必须使用双引号 2.对象: {“name”:“mi”,”ag ...

  5. 《JAVASCRIPT高级程序设计》第一章

    在使用调制解调器的时代,频繁的表单验证对客户端来说是一个很大的负担,javascript,作为一种专门进行表单验证的客户端脚本语言诞生了.到今天,javascript早已超越了当初设定的角色.Java ...

  6. 《JavaScript 高级程序设计》第一章：简介

    JavaScript 历史 JavaScript的诞生的主要是当时的 netspace 公司谋求为自己的浏览器 Navigator 添加一种脚本语言,以便在本地客户端进行一些行为操作,而这一功能的需求 ...

  7. javascript高级程序设计第三章

    看后总结: 1.区分大小写 2.标识符是有字母下划线$开头,并有字母.下划线.数字.美元符号组成. 3.建议用驼峰法命名标识符. 4.注释: 单行:// 多行: /*   */ 5.严格模式: 在js ...

  8. 《JavaScript高级程序设计》——第一章JavaScript简介

    第一章主要讲了JavaScript的诞生和发展.刚刚接触JavaScript的我,似乎对这些内容并不感兴趣,快速看了一遍就开始去看第二章了. 看完第一章,收获也就是了解到JavaScript由ECMA ...

  9. javascript高级程序设计第5章，引用类型

    object类型: 创建object实列的方式有两种,一种是new()方法,一种是对象字面量表示法: 第一种法方:  var obj = new object(); obj.name = 'name' ...

  10. javascript高级程序设计第四章 变量、作用域和内存问题

    变量包含两种,,基本类型和引用类型 基本类型是指一些简单的字段: 引用类型是☞由多个值构成的对象  引用类型的值是保存在内存中的对象,在javascript中是不允许直接访问内存中的位置; 函数的参数 ...

随机推荐

  1. Unity SurfaceShader 开始编程

    Unity SurfaceShader 开始编程 在14年年初的时候,以前给自己定下了今年要实现的三个目标.当中之中的一个就是学会编写自己的Shader,并可以投入到实际的项目应用之中.如今,转眼间日 ...

  2. apache 提示You don't have permission to access /test.php on this server.怎样解决

    把denty改成allow httpd.conf文件中. <Directory "cgi-bin"> AllowOverride None Options None O ...

  3. 【转】删除修改Eclipse里的SVN账户

    转自http://msongli.iteye.com/blog/1186648 引自: http://wanghongxu.iteye.com/blog/539806 http://jxdwuao.i ...

  4. jenkins+svn+gradle自动化部署笔记

    自己虚拟机jekins配置:(jenkins+svn+gradle)自动化部署,1.linux配置好jdk,解压tomcat,将 jenkins.war翻到webapps目录下.2.系统管理-管理用户 ...

  5. hibernate 获取实体的表名、主键名、列名(转载+修改)

    package com.escs.utils; import java.util.Iterator; import org.hibernate.cfg.AnnotationConfiguration; ...

  6. Oracle组函数、多表查询、集合运算、数据库对象（序列、视图、约束、索引、同义词）等

    count组函数:(过滤掉空的字段) select count(address),count(*) from b_user max() avg() min(),sum() select sum(age ...

  7. NET系列文章

    NET系列文章 由于博主今后一段时间可能会很忙(准备出书:<.NET框架设计—模式.配置.工具>,外加换了新工作),所以博客会很少更新: 在最近一年左右时间里,博主各种.NET技术类型的文 ...

  8. Summation of Four Primes - PC110705

    欢迎访问我的新博客:http://www.milkcu.com/blog/ 原文地址:http://www.milkcu.com/blog/archives/uva10168.html 原创:Summ ...

  9. UNIX基础知识--<<UNIX 环境编程>>读书笔记

    1 shell程序就是位于应用软件与系统调用之间的程序   每个用户登录系统,系统就会为用户分配shell (用户的登录的口令文件 在  /etc/passwd 2 ls filename  运行原理 ...

  10. .NET中操作IPicture、IPictureDisp

    .NET中操作IPicture.IPictureDisp的小随笔   [题外话] 最近在做一个调用某实验仪器的程序,这个仪器提供了Windows上COM的接口.调用仪器的时候需要传输图片,提供的接口里 ...