Javascript认识(1)

JavaScript 常见事宜

JavaScript介绍

JavaScript是一种直译式脚本语言,是一种动态型弱类型、基于原型的语言,内置支持类型。

Javascript内容

  1. Js核心语法(ECMAScript 核心语法)

  2. Dom(Document Object model) 文档对象模型

  3. Bom (Browser object model) 浏览器对象模型

Javascript书写位置

代码需要写在script标签内,并且script标签可写在任何位置。

这时就需要讨论script书写位置

下面是常用的两种位置

第一种

书写于<head><body>之间,这时由于浏览器的预解析,JS代码会先于HTML解析,导致JS代码会有部分失效。

这时我们就需要使用文档入口函数/文档就绪函数

window.load = function() {
/*
*这里写你的JS代码即可
*/
}

第二种(推荐)

书写于</body></html>之间。

由于此地位于HTML最后端,所以不用去考虑预解析等事请,较为方便。

变量

变量是什么

变量是一个临时存储数据的容器

Tip:变量声明需要使用var(es6中 还可以用let)

变量的命名规则

  1. 变量命名不能与关键字和保留字冲突

  2. 名字尽量能词能答意

  3. 设置名字可以使用中文(不要用

  4. 不能用以数字开头,变量名字里可以包括字母,数字,下划线,$.

  5. JS对于大小写敏感,可以使用小驼峰命名法

变量提升

在script标签中,一个变量声明及初始化后,变量声明部分会提升到script标签顶部

数据类型

数据类型可以分为两类:

1. 原始数据类型(基础数据类型)
2. 引用数据类型(对象类型)

原始数据类型

  1. Number:数字类型

  2. String:字符串类型

  3. Boolean:布尔值

  4. Null: 空

  5. Undefined:未定义的

  6. Symbol:标识符(es6)

Tip:使用typeof()可以查看数据类型

Number类型

parseInt(); 将内容变成整数形式
parseInt('123abc') == 123 ;
parseInt('123.1abc') == 123 ;
parseFloat(); 将内容变成浮点型(小数)
paresFloat('123abc') == 123 ;
parseFloat('123.12abc') == 123.12 ;
Number类型里特殊形式 NaN

NaN属于Number类型;

他的特殊性:

1. 自己不等于自己
2. 不等于任何一个值

我们可以使用isNaN()来判断值是否为NaN

Boolean类型

以下的Boolean值全部为false,其余的全是true;
1. Boolean('');
2. Boolean(undefined);
3. Boolean(null);
4. Boolean(NaN);
5. Boolean(0);
6. Boolean(false);

引用数据类型/对象定义

  1. Array :数组

  2. function :函数

  3. object:对象

object类型

object 又称 “无序列表” , “键值对” , “字典” , “哈希表” , “hash表” 等等。

var obj = {
name : 'zhangsan',
age : 20 ,
like : 'play'
// key值 : value值
}
//调用方式
console.log(obj.name);//打印出zhangsan
console.log(obj['age'])//打印出20
var a = 'like';
console.log(obj[a]);//打印出play

数据类型转换

强制数据类型转换

  1. Number(); 变为数值

  2. String(); 变为字符串

  3. Boolean)(); 变为布尔值

自动数据类型转换

  1. 数据类型不相同但是进行计算时

  2. 对非布尔值的数据求取布尔值

  3. 对非数值类型的数据使用一元运算符(+/-)

自动类型转化规则:

预期是什么类型的值,就调用该类型的转换函数。

由于自动转化不确定性,而且不易除错,建议在预期为Boolean,Number,String的地方,使用转换方法函数进行显式转化.

运算符

数学运算符

加  减  乘  除  求模(取余)  递增    递减   正  负  指数
+ - * / % ++ -- + - **

前置运算符(递增/递减在前),那么先将数值运算,在参加整体运算。

后置运算符(递增/递减在后),先将数值参加整体运算,然后在递增/递减。

赋值运算符

赋值    加等    减等    乘等    除等    取余等  指数赋值
= += -= *= /= %= **=

关系运算符

值相等    不等    全等(值与类型全相等)      不全等
== != === !==

逻辑运算符

  与      或      非
&& || !

三元运算符

条件 ? 条件为真时执行的代码 :条件为假

if,switch条件判断语句

if条件判断

写法

//第一种
if(条件){
条件满足时执行的代码
} //第二种
if(条件){
条件满足时执行的代码
}else{
条件不满足时执行的代码
} //第三种 Tip:这里面的else if可以写无数个
if(条件1){
条件1满足时执行的代码
}else if(条件2){
条件2满足时执行的代码
}else{
以上条件都不满足时执行的代码
}

switch 判断语句

写法

switch(值){
case 结果1 :
符和结果1执行的代码;
break;
case 结果2 :
符和结果2执行的代码;
break;
default :
以上结果都不符合执行的代码;
}
//Tip: 在实际的使用当中,允许多个case共用一块代码

if与switch的区别

if语句多用于判断在某些区间内成立,某些区间不成立的条件

switch语句只能用于判断在固定的值内的条件

循环

定义:主要能够帮助我们解决一些“重复性较高”的操作,并且“有规律可循”的操作

用法:通过设定开始和结束条件,只要符和条件就会执行的代码片段

for循环

for(var i = 0 ; i < 10 ; i++ ){
console.log('hello world');
}//打印10遍hello world

for in 循环

仅限操作对象

var arr = [1,4,8,9];
for(var i in arr){
console.log(arr[i]);//1 4 8 9
}

while循环

只有条件为真时才能执行

while(条件){
条件为真时执行的语句
}

do...while循环

不管条件是否为真,都会先运行一遍,然后在判断是否为真。

do{
代码
}while(条件);

循环中的关键字

break

作用:跳出当前循环

continue

作用:跳出当前那一轮循环。

javascript入门(1)的更多相关文章

  1. JavaScript入门篇 编程练习

    编程挑战 一.定义"改变颜色"的函数 提示: obj.style.color obj.style.backgroundColor 二.定义"改变宽高"的函数 提 ...

  2. JavaScript入门

    本篇内容是学习慕课网相关课程后,总结出可能未来会忘记的内容 (一)JavaScript入门操作 1.js代码插入位置,以及执行顺序 <head> <script type=" ...

  3. 慕课网JavaScript入门篇课程笔记

    1.js注释很重要 单行注释,在注释内容前加符号 “//”. <script type="text/javascript"> document.write(" ...

  4. JavaScript入门基础

    JavaScript基本语法 1.运算符 运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=).算术运 ...

  5. JavaScript入门介绍(二)

    JavaScript入门介绍 [函数] 函数function 是Javascript的基础模块单元,用于代码的复用.信息影藏和组合调用. function a(){} 函数对象Function Lit ...

  6. JavaScript入门介绍(一)

    JavaScript入门介绍 [经常使用的调试工具][w3school.com.cn在线编辑] [Chrome浏览器 开发调试工具]按F121.代码后台输出调试:console.log("t ...

  7. 开心菜鸟系列----函数作用域(javascript入门篇)

      1 <!DOCTYPE html>   2 <html>   3 <script src="./jquery-1.7.2.js"></ ...

  8. 开心菜鸟系列----变量的解读(javascript入门篇)

                       console.info(         console.info(window['weiwu'])          console.info(window. ...

  9. javascript入门视频第一天 小案例制作 零基础开始学习javascript

    JavaScript 是我们网页设计师必备的技能之一.我们主要用javascript来写的是网页特效.我们从零基础开始学习javascript入门. 但是,好的同学刚开始不知道怎么学习,接触js,因此 ...

  10. ArcGIS API for JavaScript 入门教程[0] 目录

    随时翻看. 转载注明出处,博客园/CSDN/B站:秋意正寒. Part 1 必看 ArcGIS API for JavaScript 入门教程[1] 渊源 你还真不一定知道这是啥.非得学吗? ArcG ...

随机推荐

  1. VSTO开发指南(VB2013版) 第一章 Office对象模型

    完美地将visual basic和office 办公软件结合起来.来自微软公司VSTO小组的权威专家所编著. 全书共712页,内容极其全面而深入,猛一看,厚地犹如庞然大物.看完离大神就不远了哦< ...

  2. Binder 原理整理

    linux进程间通信方式 1. 管道 管道的实质是一个内核缓冲区,管道的作用正如其名,需要通信的两个进程在管道的两端,进程利用管道传递信息.管道对于管道两端的进程而言,就是一个文件,但是这个文件比较特 ...

  3. Expert C Programming(C专家编程) 读书笔记

    目录 几个比较奇葩的指针赋值 int (* fun())() int (* foo())[] int (*foo[])() const 关键词的意义是什么? char const (*next )() ...

  4. C#实现图片文件到数据流,再到图片文件的转换

    //----引入必要的命名空间 using System.IO; using System.Drawing.Imaging; //----代码部分----// private byte[] photo ...

  5. 如何使用vscode-代码编辑器工具

    vscode-代码编辑器的全称是“visual studio code”,主要是一个运行于 Mac OS X.Windows和 Linux 之上的,针对于编写现代 Web 和云应用的跨平台源代码编辑器 ...

  6. 又一种获取redis cluster slots分布的小脚本

    需要:昨晚学习了cluster slots命令,之前写的脚本,有可以换种方法获取到redis cluster slots 分布情况. cluster slots的结果如下: 4 5460 5.5.5. ...

  7. 有关使用phpstudy搭建sqli-lab环境搭建时发生Uncaught Error: Call to undefined function mysql_connect()错误

    文章更新于2020-1-30 问题描述 Uncaught Error: Call to undefined function mysql_connect() 分析 经查php手册可知 mysql_co ...

  8. Spring boot2.0学习笔记(一)

    学习环境: jdk1.8 (Spring Boot 推荐jdk1.8及以上): java version "1.8.0_241" Maven 3.x (maven 3.2 以上版本 ...

  9. CF 150E Freezing with Style [长链剖分,线段树]

    \(sol:\) 给一种大常数 \(n \log^2 n\) 的做法 考虑二分,由于是中位数,我们就二分这个中位数,\(x>=mid\)则设为 \(1\),否则为 \(-1\) 所以我们只需要找 ...

  10. 清北学堂—2020.1提高储备营—Day 2 morning(并查集、堆)

    qbxt Day 2 morning --2020.1.18 济南 主讲:李佳实 目录一览 1.并查集 2.堆 总知识点:基础数据结构 一.并查集 1.描述:并查集是一类十分常用的数据类型,它有着十分 ...