js相关笔记

最新推荐文章于 2017-08-15 19:09:22 发布

肉嘟嘟_

最新推荐文章于 2017-08-15 19:09:22 发布

阅读量430

点赞数 1

分类专栏： js

本文链接：https://blog.csdn.net/cq7421/article/details/76052427

版权

js 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

1 基础知识

1.1.基本概念

为什么需要JavaScript（JavaScript有什么作用）

HTML：负责呈现什么内容，CSS：负责以何种方式来呈现。

HTML+CSS：实现了静态页面。

实际上，我们更多的页面的要求动态的，比如说新浪热点、聚焦.............页面的自动切换。

时间也应该是动态显示的。

还有验证码、注册页面的数据验证.............

那么怎么才能让页面动起来呢？

答案就是JavaScript!

<html>
<head>
    <metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/>
    <title></title>
    <styletype="text/css">
        p{
            color: red;
        }
    </style>
</head>
<body>
    <pid="time">今天是..........</p>
</body>
<script>
    var p1=document.getElementById("time");
    p1.innerHTML= new Date().toString();
</script>
</html>

很明显，这个内容不是HTML提供的，而是由JS动态生成的。

所以JS是实现动态页面的，即页面的行为。

<html>
<headlang="en">
    <metacharset="UTF-8">
    <title></title>
    <style>
        #div1{
            height: 100px;
            width: 100px;
            background: skyblue;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <divid="div1"></div>
</body>
<scriptlanguage="javascript">
    var timer= setInterval("zoom()",50);
    var div= document.getElementById("div1");
    var timer;
    var width= 100;
    function zoom(){
        if(width>= 600){
            clearTimeout(timer);
        }
        width =width + 5;
        div.style.width= width +"px";
    }
</script>
</html>

这个案例是用定时器动态去改变元素的宽度，从而实现动态效果。

怎么用？

两种方式：

（1）内部引用，使用<script></script>标签，代码直接写在标签中。

（2）外部引用，<script src=”路径”></script>。

JavaScript 的备注方式：（1）//单行注释。

（2）/*注释内容*/多行注释

JS是一种解释型语言。

计算机语言分为两种：编译型语言：java、C++、C、PHP

解释型语言：JavaScript、CSS

程序员使用高级语言编制程序，但是程序最终是由计算机去执行，但是计算机只能执行机器语言（即二进制代码），那么这个过程就必然有一个从高级语言到机器语言的“翻译”过程。

有两种“翻译”方式：

（1）编译：将代码整体翻译成机器代码，如果有错误则停止翻译，全部成功翻译完才能执行；

（2）解释：将代码翻译一条马上执行一条，如果遇到错误则停止。

2程序设计基础

2.1常规数据类型与变量

计算机程序就是去处理现实中各种数据。

数据的几个属性：名称、值、类型

字符串-string、数值-number、布尔类型-Boolean（true or false）

Alert（）警告提示框（打印）

Typeof（）数据的类型

为什么要有数据类型？

生活中是存在不同的数据类型的，计算机要解决生活问题，那么他就和生活中的数据类型产生了映射，所以有了数据类型。

数值类型的表示形式：

十进制:20.314；

八进制：023（16）；

十六进制0x23（35）；

科学计数法：3e2（3x10²）, 3.5e-2（3.5x10^-2）

为什么要有变量？

因为生活中一些数据不是一成不变的，它的值会改变，所以js里面有了变量和它相对应。

变量：

var name= "小明";

Var variable 的缩写，变量的意思。声明一个变量。

变量名name

命名的规则：

1) 可以有字母、数字、下划线和$组成

2) 数字不能开头，因为和八进制和十六进制会产生冲突。

3) 关键字不能用。

4) 一般情况下，只能英文开头，也可以是$和_，但是不建议使用。

命名的原则：

见名思义

规范：

（1）尽量使用英文单词或者组合，或者专业名词

Weight color

Filename（驼峰命名法）

（2）尽量不要使用拼音

变量的值：

变量的类型是由变量的值来决定的。

系统会为不同的类型分配不同的大小来存储数据。

如果是布尔类型就分配一个字节的大小来存储；

如果是数字和字符串，那么根据他的大小和长度来分配字节数来存储。

JS是弱类型语言，所有的类型的变量都是用var来声明。

JS是动态类型的语言，变量的类型会根据值得变化而变化，不会出错。

什么是变量？

变量的本质：变量是一个内存单元，编码则是内存单元的地址

 var weight= 65;
weight = weight -5;

用本质来解释 weight = weight- 5；

把名字为weight的内存单元中的值65拿出来，之后和5做减法运算，然后把得到的结果在放回到名字为weight的内存单元中。

JS语言特点：；

更加高级，不严谨。

变量不声明就可以使用。

"use strict";
weight= 65;
alert(weight);

使用严谨的格式，就必须先定义变量才能使用变量。

Name这个名字是特殊的，使用name来给变量起名字时，它不报错。

weight1 = "中等";
weighhtl = 123;
alert(weight1);

此处输出不是预期中的123，而是“中等”，原因是两个拼写不一样，而且不会报错。

如果使用严格模式，明显可以看到第二个变量拼写错误。

2.2对象类型

对象在js当中对应的是object。

定义一个狗的对象

var dog= {name:"藏藏",type:"藏獒",color:"花色",
    sex:"雄",age:3,marry:false};

使用new Object（）定义一个对象类型的变量。

var dog= new Object();
dog.name= "藏藏";
dog.age= 3;
dog.marry= false;

为什么有对象？

和为什么要有数据类型是一样的。就是生活中处处都是对象，所以JS中有这种对象类型。

如何使用对象里面的属性？

使用对象名+.+对象属性名。

alert(typeof(dog.name));

肉嘟嘟_

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js相关笔记

jS基本知识点
复制链接

扫一扫

专栏目录