JavaScript他是一种描述性语言,其实他并不难学,只要用心学,一定会学好,我相信大家在看这篇文章的时候,一定也学过HTML吧,使用JavaScript就是为了能和网页有更好的交互,下面切入主题。

一.JavaScript

1.什么是JavaScript

JavaScript是一种描述性语言,也是一种基于对象(Object)和事件驱动(Event Driven)的,并具有安全性的脚本语言。

2.JavaScript的特点

JavaScript主要用来向HTML页面添加交互行为。

JavaScript是一种脚本语言,语法和Java类似。

javaScript一般用来编写客户端的脚本。

JavaScript是一种解释性语言。

3.JavaScript的组成

ECMScript标准(规定所有属性,方法和对象的标准)

BOM浏览器对象模型(Browser Object Model):与HTML交互

DOM文档对象模型(Document Object Model):访问和操纵HTML文档

4.JavaScript基本结构

  1. <script language=”javascript” type=”text/javascript”>
  2.  
  3. </script>
  4.  
  5. Language=”javascript”用来表示使用的语言是javascript

5.JavaScript执行原理

1. 浏览器客户端向服务器端发送请求。(用户在浏览器地址栏中输入的地址)

2.数据处理:服务器端将某个包含javaScript的页面进行处理。

3.发送响应:服务器端将含有javascript的HTML文件进行处理页面发送到浏览器客户端,然后由浏览器客户端从上直下逐条解析HTML标签和JavaScript标签,将页面效果呈给用户。

二.在网页中引入JavaScript的方式

1.使用<script>标签。

2.使用外部JavaScript文件。

希望多个页面中运行JavaScript实现相同效果,通常使用外部文件为.js的文件。

如何引用.js为扩展名的文件:

<script src=”../1.js”></script>

注意:外部文件不能包含<script></script>

3.直接在HTML标签中

  1. <input name=’btn’ type=”button” value=”弹出消息框” onclick=”javascript:alert(“欢迎你”);”/>

三.JavaScript核心语法

1.变量的声明和赋值

变量的声明只有用var,变量的命名规范和Java类似。Var num=1;

在JavaScript中变量可以不用声明就可以直接使用,但是不推荐这种用法。

2.数据类型

Undefined(未定义类型)

Null(空类型)

Number(数字类型)

String(字符串类型)

Boolean(布尔类型)

3.undefined和null的区别

null 表示"没有对象",即该处不应该有值。典型用法是:

(1) 作为函数的参数,表示该函数的参数不是对象。

(2) 作为对象原型链的终点。

Object.getPrototypeOf (Object.prototype)// null

undefined 表示"缺少值",就是此处应该有一个值,但是还没有定义。典型用法是:

(1)变量被声明了,但没有赋值时,就等于 undefined。

(2) 调用函数时,应该提供的参数没有提供,该参数等于 undefined。

(3)对象没有赋值的属性,该属性的值为 undefined。

(4)函数没有返回值时,默认返回 undefined。

4.只有6种情况,判定结果为假。

null,false,undefined,0,"",NaN

5.字符串的一些常用方法

toString();返回字符串

toLowerCasee();把字符串装换为小写。

toUpperCase();把字符串转换成大写

charAt(index);返回在指定位置的字符串

indexOf(str,index);查找某个指定的字符串在字符串中首次出现的位置

Substring(index,index);返回位于指定索引index1和index2之间的字符串(包括index1不包括index2)

Split(str);将字符串分割为字符数组

6.创建数组并为数组赋值的三种方式

01. Var num=(‘1’,’2’);

02.var num=new Array(2);

Num[0]=1;

Num[1]=2;

03.var num=[‘1’,’2’];

数组的常用方法和属性

Length:设置或返回数组中元素的数目

Join():把数组的所有语速放入一个字符串,通过分割符进行分割。

Sort():对数组进行排序

Push():向数组末尾添加一个或更多元素,并放回新的长度。

  1. <script type="text/javascript">
  2.  
  3. //01.方式一:创建数组,并给数组赋值
  4.  
  5. // var fruit = new Array('apple', 'orange', 'peach', 'bananer');
  6.  
  7. //02.方式二:先创建数组,后通过下标给数组赋值
  8.  
  9. var fruits = new Array(4);
  10.  
  11. fruits[0] = 'apple';
  12.  
  13. fruits[1] = 'orange';
  14.  
  15. fruits[2] = 'peach';
  16.  
  17. fruits[3] = 'bananer';
  18.  
  19. //03方式三:和方式一类似只不过改变了符号
  20.  
  21. //var fruitss = new Array['apple', 'orange', 'peach', 'bananer'];
  22.  
  23. //04.访问数组中下标为3的数据
  24.  
  25. document.write(fruits[3]);
  26.  
  27. //05通过数组的join方法把元素放到字符串中并用指定分隔符进行分割
  28.  
  29. var result = fruits.join(',');
  30.  
  31. //06通过sort方法对数组进行排序
  32.  
  33. fruits.sort();
  34.  
  35. //06.向末尾添加一个或多个元素,最后返回该数组的新长度
  36.  
  37. var length= fruits.push('wert','foot');
  38.  
  39. document.write('\n' + length);
  40.  
  41. //07.遍历数组
  42.  
  43. for(var item in fruits)
  44.  
  45. {
  46.  
  47. alert(fruits[item]);
  48.  
  49. }
  50.  
  51. </script>

7.运算符

8程序调试

方案一:在VS中调试

步骤:01.将要调试的页面设置成起始页

02.设置断点

03.按F5启动调试

方案二:chrome浏览器调试

步骤:01.点击F12,将工具调出

02.设置断点

03.刷新页面

方案三:IE浏览器

步骤:01.F12,开发人员工具

02.切到脚本选项卡

03.设置断点

04.启动调试

05.刷新

四.JavaScript中的函数

1.常用的系统函数

01.   parseInt(“字符串”);

parseInt()函数首先查看位置为0处的字符,判断他是否为一个有效数字,如果不是则返回NaN,不在执行其他操作,但如果该字符是有效参数,则该函数将查看位置为1处的字符,进行同样的测试,这一过程将持续到发现该字符是有效字符为止,此时该字符将之前的字符串转换成数字。

eg:

var num1=parseInt(“78.9”)//返回值为78

var num2=parseInt(“afa78.9”)//返回值为NaN

02.parseFloat(“字符串”);

他的用法和parseInt类似,只不过字符串中出现的第一个点将被认为是有效字符.

eg:

var num1=parseFloat(“78.9”)//返回值为78

var num2=parseFloat(“afa78.9”)//返回值为NaN

2.自定义函数

在JavaScript中,自定义函数是由function,函数名,一组以参数以及置于括号中待执行的JavaScript语句组成。

下面来看一看语法:

function 函数名(参数1,参数2,..)

{

//JavaScript语句

[return 返回值]

}

function是定义函数的关键字,必须有。

参数1,和参数2是该函数的参数,因为JavaScritp他本省的类型是弱类型,所有在给定参数时没有必要提供类型

{}定义的函数的开始和结尾.

return 语句用来规定函数返回的值.

2.调用函数

要执行一个函数,首先肯定要调用这个函数,必须制定函数名和其后的参数。

eg:

  1. <script type=”text/javascript”>
  2.  
  3. function show(){
  4.  
  5. }
  6.  
  7. show();
  8.  
  9. </script>

3.匿名函数

1.匿名函数的理解

匿名函数就是没有名字的函数了,也叫闭包函数(closures),允许临时创建一个没有指定名称的函数。最经常用作回调函数(callback)参数的值。

function 函数名(参数列表){函数体;}

如果是创建匿名函数,那就应该是:
function(){函数体;}

因为是匿名函数,所以一般也不会有参数传给他。

2.为什么要用匿名函数

为什么要创建匿名函数呢?在什么情况下会使用到匿名函数。匿名函数主要有两种常用的场景,一是回调函数,二是直接执行函数。

eg:

  1. <script language="javascript">
  2. var a = "a";
  3. (function(){
  4. var a="b";
  5. alert(a);
  6. })();
  7. alert(a);
  8. </script>

在上面这段代码中,会顺序输出两个alert框。第一个alert框内容为b,第二个为a。以为该Script标签中有一个匿名方法时自调用的,所有首先弹出b,然后碰到匿名方法后的alert(a)则弹出a。

入门必看--JavaScript基础的更多相关文章

  1. Java编程学习知识点分享 入门必看

    Java编程学习知识点分享 入门必看 阿尔法颜色组成(alpha color component):颜色组成用来描述颜色的透明度或不透明度.阿尔法组成越高,颜色越不透明. API:应用编程接口.针对软 ...

  2. Liunx新手入门必看

    安装CentOS(Linux的一个常用发行版本,互联网公司经常使用这个发行版)用到的软件: VMware_workstation_full_12.5.2.exe 虚拟机软件,虚拟机由这个软件安装.管理 ...

  3. 使用Code First建模自引用关系笔记 asp.net core上使用redis探索(1) asp.net mvc控制器激活全分析 语言入门必学的基础知识你还记得么? 反射

    使用Code First建模自引用关系笔记   原文链接 一.Has方法: A.HasRequired(a => a.B); HasOptional:前者包含后者一个实例或者为null HasR ...

  4. 15个初学者必看的基础SQL查询语句

    本文由码农网 – 小峰原创翻译,转载请看清文末的转载要求,欢迎参与我们的付费投稿计划! 本文将分享15个初学者必看的基础SQL查询语句,都很基础,但是你不一定都会,所以好好看看吧. 1.创建表和数据插 ...

  5. 三分钟教会你Python数据分析—数据导入,小白基础入门必看内容

    前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者:小白 PS:如有需要Python学习资料的小伙伴可以加点击下方链接自行 ...

  6. 零基础小白Python入门必看:面向对象之典型魔术方法

  7. 【repost】学JS必看-JavaScript数据结构深度剖析

    JavaScript以其强大灵活的特点,被广泛运用于各种类型的网站上.一直以来都没怎么好好学JS,只是略懂皮毛,看这篇文章时有读<PHP圣经>的感觉,作者深入浅出.生动形象地用各种实例给我 ...

  8. 新手必看ES6基础

    ES6 基础 一.新的变量声明方式 let/const 与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升. 通过2个简单的例子来说明这两 ...

  9. 学JS必看-JavaScript数据结构深度剖析

    回归简单 要理解JavaScript,你得首先放下对象和类的概念,回到数据和代码的本原.前面说过,编程世界只有数据和代码两种基本元素,而这两种元素又有着纠缠不清的关系.JavaScript就是把数据和 ...

随机推荐

  1. 轻松理解JS基本包装对象

    今天来讨论一下JS中的基本包装对象(也叫基本包装类型),之前刚学到这里的时候,自己也是一头雾水,不明白这个基本包装对象到底是个什么鬼,后来找了很多资料,终于看清了它的真面目.首先呢,我们现在复习一下J ...

  2. 云计算之路-阿里云上:Wireshark抓包分析一个耗时20秒的请求

    这篇博文分享的是我们针对一个耗时20秒的请求,用Wireshark进行抓包分析的过程. 请求的流程是这样的:客户端浏览器 -> SLB(负载均衡) -> ECS(云服务器) -> S ...

  3. Provider 错误 '80004005' 未指定的错误 /conn.asp,行 23

    网站本来正常,由于网站修改了title标签的内容,想要百度快照快点更新. 就自己提交快照.在下面网站: http://zhanzhang.baidu.com/sitesubmit/index 提交UR ...

  4. Dropbox的可用Hosts文件

    108.160.167.203 www.dropbox.com 108.160.167.203 dropbox.com 108.160.165.211 dl-client677.dropbox.com ...

  5. ThinkPHP之数据库操作

    Model文件位置 ThinkPHP使用的是MVC架构,所以我们我们在操作数据库时,首先需要创建自己的Model类. 在每个模块下有个Model文件夹,我们可以将Model类放置在该文件夹下.如果多个 ...

  6. ECMAScript —— 学习笔记(思维导图版)

    导图

  7. android学习——Android Studio下创建menu布局文件

    一.问题: android studio项目中没有看到menu文件夹: 在android studio项目中想要添加menu布局文件,一开始我的做法是:直接在res文件夹右键选择xml文件来添加,如下 ...

  8. Dinic问题

    问题:As more and more computers are equipped with dual core CPU, SetagLilb, the Chief Technology Offic ...

  9. Intel 80x86 Linux Kernel Interrupt(中断)、Interrupt Priority、Interrupt nesting、Prohibit Things Whthin CPU In The Interrupt Off State

    目录 . 引言 . Linux 中断的概念 . 中断处理流程 . Linux 中断相关的源代码分析 . Linux 硬件中断 . Linux 软中断 . 中断优先级 . CPU在关中断状态下编程要注意 ...

  10. KPROCESS IDT PEB Ldr 《寒江独钓》内核学习笔记(3)

    继续上一篇(2)未完成的研究,我们接下来学习 KPROCESS这个数据结构. 1. 相关阅读材料 <深入理解计算机系统(原书第2版)> 二. KPROCESS KPROCESS,也叫内核进 ...