文档章节

JS(JavaScript)初始

o
 osc_715mam6n
发布于 2018/09/04 17:47
字数 1025
阅读 64
收藏 0

行业解决方案、产品招募中!想赚钱就来传!>>>

day43  JS初识

今日内容:

HTML: 文档结构

CSS: 修改文档的外观样式

JS:实现页面上的动态

 

JS文件的引入方式:  

  1.script标签内写代码

<script>
  //在这里写你的代码
</script>

 

  2.引入额外的JS文件

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

 

  3.注释(注释是代码之母)

//  这里是单行注释

/* 
 这里是多行注释

*/

  4.结束符号

JavaScript中的语句要以分号( ; ) 为结束符.

 

 

1.JS的历史及ECMAScript

  JS ----> JavaScript(雷峰塔)          Java(雷锋)

  ECMAScript   一个标准    ES5/ES6

  node.js  --------> 跑在服务端的JS

2.JS要学习的内容

  JS三大部分:

    1.基础语法

    2.操作浏览器对象  BOM

    3.操作文档上的标签  DOM

3.JS导入方式

  1.直接写在页面的Script标签内部

  2.将JS代码写在单独的一个JS文件,然后通过页面上的Script标签的SRC属性导入

4.JS基本语法

   1.数据类型

    JavaScript拥有动态的类型------弱类型,一个参数可以赋值不同类型的变量

var  x;   // x是undined
var  x=1;   //此时x是数字
var  x="alex"   //此时x是字符串

 

      1.数字 (number) 

        parseInt()

        parseFloat

        NaN    ----->Not  a  Number

    JavaScript不区分整型浮点型,就只有一种数字类型

var  a = 12.34;
var  b = 20;
var  c = 123e5  //123* 10^5      12300000
var  d = 123e-5 //123*10^-5      0.00123

    还有一种NaN,表示不是一个数字 (Not a Number).

parseInt("123")   // 返回123
parseInt("ABC")  //返回NaN,NaN属性是代表非数字的特殊值,用来指定某个值不是数字
parseFloat("123.456")  // 返回123.456

 

      2.字符串

var a="Hello";
var b="World";
var c = a + b;
console.log(c);   // 得到HelloWorld

常用方法:

方法 说明
.length 返回长度
.trim() 移除两端的空白
.trimLeff()

移除左边的空白

.trimRight 移除右边的空白
.charAt(n) 返回第n个字符
.concat() 拼接
.indexOf(substring,start) 子序列位置
.substring(from,to) 根据索引获取子序列
.slice(start,end) 切片
.toLowerCase() 小写
.toUpperCase() 大写
.split(delimiter,limit) 分隔

 

      3.布尔值

    true 和 false 都是小写

var  a = true;
var  b = false;
"(空字符串),0,null,undefined,NaN"都是false

 

      4.null

    null 表示值是空的,一般在需要指定或清空一个变量时才变量时才会使用,例如 name=null

    null 表示变量的值是空

      5.undefined

    undefined 表示当声明一个变量但未初始化时,该变量的默认值是undefined.还有就是函数无明确的返回值时,返回的也是undefind

 

null 和 undefined 对比:

     null表示变量的值是空,undefined则表示只声明乐变量,但还没有赋值

      6.对象

    JavaScript中的所有事物都是对象:字符串,数值,数组,函数.....除此之外,JavaScript允许自定义对象

        1.数组(列表)--------类似于Python中的列表

var  a= [123,"ABC"];
console.log(a[1]);  //输出"ABC"

常用方法:

方法 说明
.length 数组的大小
.push(ele) 尾部追加的元素
.pop() 获取尾部的元素
.unshift(ele) 头部插入的元素
.shift() 头部移除的元素
.slice(start,end) 切片
.reverse() 反转
.join(seq) 将数组元素连接成字符串
.concat(val,,,) 连接数组
.sort() 排序
.forEach() 将数组的每个元素传递给回调函数
.splice() 删除元素,并将向数组添加新元素
.map() 返回一个数组元素调用函数处理后的值新数组

 

 

        2.自定义对象(字典)

   2.运算符

     注意 强等于 和 弱等于的区别

       1.算术运算符

+ - * / % ++ --

       2.比较运算符

>  >=  <  <=  !=(不等于)  ==(弱等于)  ===(强等于)  !==( ) 


1 == "1"     // true   弱等于,会先把类型转换成相同的,只比较数值
1 === "1"   //false   强等于,会比较数据类型,也会比较数值

 

       3.赋值运算符

=  +=  -=  *=  /=

 

       4.逻辑运算符

与: &&   或:  ||   非: !

 

   3.流程控制

        1.if else

var a=10;
if (a>5){
    console.log("yes")
}        
else {
    console.log("no")
}

      2.for 循环

for (var  i=0; i<10;i++){
   console.log(i);
}

      3.switch

var day = new Date().getDay();
switch  (day) {
    case  0;
    console.log("Sunday");
    break;
    case  1;
    console.log("Monday");
    break;
default;
    console.log("...")
}

      4.while

var i = 0;
while (i<10) {
    console.log(i);
    i++;
}

      5.三元运算

var a = 1;
var b = 2;
var c=a > b ? a : b

 

o
粉丝 0
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。
CSS Browser Selector

CSS Browser Selector 是一个小的 JS 库,可增强 CSS 的选择器功能,支持根据不同的操作系统和浏览器来编写指定的 CSS 代码,可检测浏览器、浏览器版本、平台、平台版本、设备、设备版本、m...

匿名
2013/01/17
2.7K
1
在多个浏览器上运行脚本--Queen

假设你想和朋友们玩这么个游戏:你写下某个数字,然后让朋友们猜你写的是什么数字。你的朋友们将不断的给你一些猜测的数字,直到猜中为止。 现在想象你的朋友都是使用的浏览器,这个游戏就相...

匿名
2013/01/24
4.4K
1
Web开发组件管理器--Bower

Bower 是一个针对Web开发的包管理器。该工具主要用来帮助用户轻松安装CSS、JavaScript、图像等相关包,并管理这些包之间的依赖。 功能有些类似于Component。不同之处是,Component是围绕Git...

匿名
2013/02/01
1.2W
2
Javascript图元绘制库--ternlight

基于HTML CANVAS API的Javascript库,提供在HTML页面上绘制图元——如流程图的能力。 目前已支持简单的矩形图元和图元间的连线(直线、直角连线两种),拖拽图元等能力。 该javascript librar...

fancimage1
2013/02/07
6.2K
1
JavaScript 服务器页--JSSP

JSSP (JavaScript Server Pages) 可以让你在 Java 的应用服务器上使用 JavaScript 生成网页。支持已有的 Java 包和嵌入式 SQL 命令。包含 Dervish 这个 JavaScript 交互操作包用于简化 Ajax...

匿名
2013/02/11
3.7K
0

没有更多内容

加载失败,请刷新页面

加载更多

好用到爆的 Java 技巧

本文不是一个吹嘘的文章,不会讲很多高深的架构,相反,会讲解很多基础的问题和写法问题,如果读者自认为基础问题和写法问题都是不是问题,那请忽略这篇文章,节省出时间去做一些有意义的事情...

码农突围
27分钟前
8
0
消息队列(MessageQueue)-分析

这里分析消息队列的原理和一般做法和其理念价值 这里还会 分析 NATS 和其可改进点 TODO

梦想游戏人
31分钟前
20
0
Redis 教程

Redis 教程 REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统。 Redis是一个开源的使用ANSI C语言编写、遵守BSD协议、支持网络、可基于内存亦可持久化的...

rootliu
33分钟前
9
0
SPSSAU 付费数据研究报告服务

SPSSAU-付费数据分析报告服务(周老师提供) 本文分享自微信公众号 - SPSSAU(spssau)。 如有侵权,请联系 support@oschina.cn 删除。 本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起...

SPSSAU
2017/11/08
0
0
芋艿-springcloud gateway

http://www.iocoder.cn/Spring-Cloud/Spring-Cloud-Gateway/?github springcloud gateway 官方文档 https://cloud.spring.io/spring-cloud-gateway/reference/html/#gatewayfilter-factories......

Java搬砖工程师
52分钟前
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部