作为一名web开发人员，日常用的最多的就是js,也就是大名鼎鼎的ECMAScript,又称javascript。再次声明js与java除了语法上相似，没有半毛钱关系。据说之所以叫javascript,是因为过去网景公司花了十天时间开发历史上的第一版js,但当时没有名气，故借用java之名在该script前缀上加上一个java，以提升其知名度。具体的历史或老皇历，百度或者相关官网一大堆，这里不再赘述。

作为一名前后台都攻的软件工程师，虽说平时js足以解决常见的问题和共性问题，但发现总会有这样那样的小错误，有的时候，就是那么一个小错误，调试了3~4小时，浪费了很多时间，最后解决了，却发觉分分钟可以解决的问题，我居然花了这么长时间，觉得太对不起有限的光阴。所以决定好好系统学习下javascript。在我看来，为该书做序的人，说的一句话，挺对的，js上手是非常容易的，要么跟着w3scholl一遍遍敲，记得当初我学习js的时候就是这样，又或者参考廖雪峰的js教程，他们的教程很容易让你熟悉并了解js。

下面是网站:

w3school:  http://www.w3school.com.cn/js/index.asp

廖雪峰教程:https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000

不过如果是小白建议还是从w3school入手吧，当然在此也可以看看廖雪峰。我个人是从w3school一遍遍敲，一遍遍运行，一遍遍找博客了解和熟悉。但是博客毕竟是零散的，不够系统。视频了，我个人学习视频一大堆，有好哥们分享的，也有朋友给的。说到视频，如果你是完全的小白，建议可以先看视频再实战，因为视频可以让你了解熟悉，等到有了基本的熟悉，去除了一些陌生感，就是实战吧！

或许有人问，我为什么不看视频学习呢?

第一，我个人有相关经验，可以看懂js和使用js解决项目问题;

第二,作为一名工程师，平时忙于工作，没有很多时间去看视频，视频的时间太长了;

第三，在我看来视频适合小白，完全不懂的，但是作为有相关实战经验的人，没多大必要，当然有些进阶相关的视频还是不错的;

第四，书相对于视频，系统全面，而且，上下班地铁差不多的两个小时，我可以通过手机阅读，至少可以读完一章,这样时间也就充分的利用了;

说到js，至今我仍觉得它是一个非常神秘又好用的玩意，它可以做出酷炫的效果，也可以让我前后端分离开发,同时作为一名Java程序员，它的语法对我而言太容易懂了。当然，还是那句话，入手容易，深入难。如今我要打破这个瓶颈。

下面进行系统的讲解:

1.JavaScript由三部分组成

(1)核心(ECMASCRIPT)，又称ECMA262，是js的核心;

ECMA由以下部分组成:

a.语法

b.类型

c.关键字

d.语句

e.保留字

f.操作符

g.对象

(2)浏览器对象模型;

常用的window,location，screen等，

我用的比较多的，还是window和location

window常用的方法

alert（）警示框  常用于提示信息

confirm()确认框    通常用于是否删除这样的或是否启用等

propt()输入框  这个用的不多

setInterval()每隔多长时间加载 ，可以调用多次， ajax轮询可以使用它，不过太消耗服务器资源，应用的通常是数据定时更新

setTimeout()每隔多长时间加载 ，一般只加载一次

location.href用的比较多  前后端分离时，不过通过form提交的形式，直接通过window.location.href进入另外一个界面

location.reload用的也比较多

当然浏览器对象除了上述说的，还有navicator，不过这个我也没用过，开发一段时间，从未用过，看字面意思，似乎有导航的作用

(3)文档对象模型;

文档对象，简单的说对节点进行增，删，改，查。

增加的话，比如遍历数据后，将html元素，通过append方法追加到某个ID选择器或者类选择器中

删除的话，节点删除，比如，上级公司下级部门这样的

修改的话，replace方法替换

查的话，find或push之类的方法

这是我个人开发用的比较多的

2.html页面如何写js

html写js有三种方式：

(1)外部js 通过<script src="test.js"></script>引入html中，从而可调用该js文件中所有函数,我个人建议，非常强烈建议开发，不论是初学者还是半路出家的，多写外部js少写内部js或者直接在<body></body>中嵌入js,因为这种写法一点都不好，至少我这么认为,写外部js可以将公共部分js抽取复用，而且方便管理修改规范;

运行示例:

test.html

<html>

<head>

<script src="test.js"></script>

</head>

<body>

</body>

</html>

test.js

alert("hello js")

(2)内部js 在<head></head>中嵌入<script></script>

<html>

<head>

<script>

alert("hello js")

</script>

</head>

<body>

</body>

</html>

(3)<body></body>内嵌入js

<html>

<head>

</head>

<body>

<script>

alert("hello js")

</script>

</body>

</html>

（1）还是那句话，建议使用，(2)的话，慎用，因为到时对web进行优化时，<head></head>内嵌入大量的js将会导致浏览器加载网页速度变慢,不利于web性能优化

另外js文件放头部和尾部的效果是不一样的，因为头部优先加载，头部通常放置css外部文件，尾部放置js，因为浏览器优先加载头部，由头到尾，由于css优先加载，这样渲染效果也会很快，如果是js文件放置头部的话，会导致css渲染效果变慢从而导致影响用户体验

JavaScript高级程序设计学习(一)之介绍的更多相关文章

  1. JavaScript高级程序设计---学习笔记（一）

    今天,2017.3.17开始利用课余时间仔细学习<JavaScript高级程序设计>,将需要掌握的知识点记录下来,争取把书里的所有代码敲一遍并掌握. 1.标识符命名最好是第一个字母小写,剩 ...

  2. JavaScript高级程序设计学习(四)之引用类型

    在javascript中也是有引用类型的,java同样如此. javascript常见也比较常用的引用类型就熟Object和Array. 一个对象和一个数组,这个在前后端分离开发中也用的最多.比如aj ...

  3. JavaScript高级程序设计学习(三)之变量、作用域和内存问题

    这次讲的主要是变量,作用域和内存问题. 任何一门编程语言,都涉及这三个. 变量,比如全局变量,局部变量等,作用域,也分全局作用域和方法作用域,内存问题,在java中就涉及到一个垃圾回收的问题,由于ja ...

  4. javascript高级程序设计学习笔记

    javascript高级程序设计,当枕头书已经好久了~zz  现在觉得自己在js的开发上遇到了一些瓶颈,归根究底还是基础太薄弱,所以重新刷一遍js高程希望有更新的认识. 一.javascript简介 ...

  5. JavaScript高级程序设计学习(四)之引用类型（续）

    一.Date类型 其实引用类型和相关的操作方法,远远不止昨天的所说的那些,还有一部分今天继续补充. 在java中日期Date,它所属的包有sql包,也有util包.我个人比较喜欢用util包的.理由, ...

  6. JavaScript高级程序设计学习笔记--面向对象的程序设计（二）-- 继承

    相关文章: 面向对象的程序设计(一) — 创建对象 http://www.cnblogs.com/blackwood/archive/2013/04/24/3039523.html 继承 继承是OO语 ...

  7. javascript 高级程序设计 学习笔记

    <!--<script> // 异步请求封装 IE6即以上浏览器 // ajax(url,fnSucc,selectID,fnFaild) //url 请求地址 //fnSucc 异 ...

  8. JavaScript高级程序设计---学习笔记（二）

    面向对象程序设计1.属性类型.定义多属性.读取属性特性对象的属性在创建时都带有一些特征值,JavaScript通过这些特征值来定义它们的行为.这些特性是为了实现JavaScript引擎用的,因此不能直 ...

  9. JavaScript高级程序设计学习笔记第一章

    作为学习javascript的小白,为了督促自己读书,写下自己在读书时的提炼的关键点. 第一章: 1.JavaScript简史:Netscape Navigator中的JavaScript与Inter ...

随机推荐

  1. （整理）Sublime Text 3 安装、破解、安装Package Control、汉化、添加到右键菜单、代码格式化、禁止更新

    Sublime Text 3好用,但是每次安装到最后用着顺手,得在网上找半天安装.破解.安装Package Control.汉化.添加到右键菜单.代码格式化等等的教程,今天有空给自己整理一下吧. 一. ...

  2. 性能监控(1)--linux下的top命令

    Linux下的监控工具 top命令 top命令能够实时显示系统中各个进程的资源占用情况,其输出信息分为两部分,前半部分为系统统计信息,后半部分是进程信息. 第一行是任务队列信息,它的结果等同于upti ...

  3. javascript如何操作数组

    说明 如需求:后台返回一个用户列表数组,该数组可能为空,最多只可能会有10个用户, 页面中A,B两处展示用户列表,B处不管如何都会展示返回的所有用户,A处需要展示10个用户,不足10个展示默认用户, ...

  4. SSM(Spring+SpringMvc+Mybatis)整合笔记

    1.使用开发工具 jdk1.8 eclipse Tomcat7.0 MySql 2.创建数据库和表,由于重点是整合,所以数据库就随意加几条数据. 3.创建动态Web项目(推荐使用Maven可以用配置来 ...

  5. session一致性架构设计

    什么是session? 由于HTTP协议是无状态的协议,因此它不会去记住上一次浏览器访问服务器时的信息.同一个用户的两次操作,与两个不同用户的操作,对它来说是一样的. 这样虽然满足了互联网web应用的 ...

  6. ImmediateFunc.js

    (function(){ var days = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'] var today = new Date() var msg = ...

  7. vue 父子组件互相传值容易出现的报错

    对于父子组件之间的互相传值,报错如下: [Vue warn]: Avoid mutating a prop directly since the value will be overwritten w ...

  8. Kafka初入门简单配置与使用

    一 Kafka概述 1.1 Kafka是什么 在流式计算中,Kafka一般用来缓存数据,Storm通过消费Kafka的数据进行计算. 1)Apache Kafka是一个开源消息系统,由Scala写成. ...

  9. 启动weblogic服务时，还需要输入用户名和密码的解决方法

    当启动weblogic服务时,还需要输入用户名和密码,相当繁琐,如下: 而在生产环境中,一般会要求不要在每次启动时都输入用户名密码, 因此可以通过一些简单的配置达到此目的,通常的做法有两种: 1.修改 ...

  10. loadrunner 脚本优化-关联设置

    脚本优化-关联设置 by:授客 QQ:1033553122 关联的原理 关联也属于一钟特殊的参数化.一般参数化的参数来源于一个文件.一个定义的table.通过sql写的一个结果集等,但关联所获得的参数 ...