首页 > 编程语言 > 详细

前端基础之JavaScript

时间:2019-09-07 19:07:58      阅读:88      评论:0      收藏:0      [点我收藏+]

一:JS基础概念

【1】JS引入外部文件

(1)

    <script>//写JS代码</script>

(2)

 <script src=""></script>

 

【2】JS注释

//单行注释

/*多行注释*/

 

二:JS语言基础

【1】变量

(1)变量名可以使用_数字 字母 下划线 不能以数字开头

(2)声明变量可以使用var变量名;的格式进行声明

例如:

var name = ‘SR‘;
var age = 18;

PS:

  (1)变量名区分大小写

  (2)推荐使用驼峰体命名

  (3)关键字不能作为变量名

 

(3)ES6新增了let命令,用于声明变量。其用法类似于var,但是所声明的变量只在let命令所在的代码块内有效。例如:for循环的计数器就很适合使用let命令

例如:

for (let i=0;i<arr.length;i++){...}

 

【2】常量:

关键字:const

作用:常量一旦被定义 便不能被更改

例如:

const ip = ‘127.0.0.1‘;

 

三:数据类型

【1】数字型

(1)在JS中没有整型/浮点型 统一都是数字型

例如:

//整数型
var age = 18;

//小数型

var salary = 17231.6;

(2)NaN:

作用:表示的不是一个数字

例如:

parseInt(‘123.134561‘)  //整形 显示123 只显示小数点前面的

parseFloat(1213.1313564) //显示所有数据

parseInt(‘SR‘) //NaN 没有数字

parseInt(‘SR123,.12315‘)  //NaN 开头不是数字

 

【2】字符串类型:

(1)定义方式:

var a = ‘hello‘;

(2)字符串拼接:

var a = ‘hello‘;

var b = ‘world‘;

var c = a + b;

console.log(c);  //helloworld

 

(3)字符串的常用方法:

  (1)length:返回长度

例如:

var name = ‘hello world‘;

name.length;  // 11

  (2)trim:移除空白长度

例如:

var name = ‘   hello world   ‘;
//
name.trim();  // hello world

name.trimLeft();  // 移除左边空白

name.trimRight(); // 移除右边空白

PS:其只能移除空白 不能移除其余的符号

  (3)charAt:索引取值

例如:

var name = ‘hello world‘;

name.charAt(0);  // h

  (4)concat:字符串拼接

例如:

var s = ‘hello‘;
var b = ‘world‘;

s.concat(b);  // helloworld

PS:在JS中推荐使用+号作为拼接

  (5)indexOf:查看元素对应的索引号

例如:

var s = ‘hello world‘;
s.indexOf(‘h‘);  // 0

  (6)substring:根据索引获取子序列号

例如:

var s = ‘hello world‘;
s.substring(0,5);  //hello

  (7)slice:切片

例如:

var s = ‘hello world‘;
s.slice(0,5);  //hello

  (8).toLowerCase():xiaoxie

例如:

var s = ‘Hello world‘;
s.toLowerCase(); 

  (9).toUpperCase():大写

例如:

var s = ‘Hello world‘;
s.toUpperCase();

  (10)split:切分

例如:

var s = ‘He|llo| world|‘;
s.split(‘|‘);  // ["He", "llo", " world", ""]
s.split(‘|‘,2);  // ["He", "llo"]
技术分享图片
string.slice(start, stop)和string.substring(start, stop):

两者的相同点:
如果start等于end,返回空字符串
如果stop参数省略,则取到字符串末
如果某个参数超过string的长度,这个参数会被替换为string的长度

substirng()的特点:
如果 start > stop ,start和stop将被交换
如果参数是负数或者不是数字,将会被0替换

silce()的特点:
如果 start > stop 不会交换两者
如果start小于0,则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
如果stop小于0,则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)


slice和substring的区别
slice与substring区别

 

(4)模板字符串:模板字符串(template string)是增强版的字符串,用反引号(`)标识。它可以当做普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。

例如:

// 普通字符串
`这是普通字符串!`
// 多行文本
`这是多行的
文本`
// 字符串中嵌入变量
var name = "jason", time = "today";
`Hello ${name}, how are you ${time}?`

PS:如果模板字符串使用反引号 需要使用反斜杠进行转义

 

【3】布尔值:

作用:判断事务真假

关键字:true false 都是小写

例如:

var a = true;
var b = false;

PS:0 null nan undefined等都是false

 

null:表示值为空 已经为变量赋值 但是变量值为空了

undefined:表示只是声明了一个变量 但是根本没有为其赋值

 

【4】数组:

作用:存放多个数据 类似于列表

技术分享图片

 

 forEach:

技术分享图片

 

例如:

技术分享图片

 

 

splice:

技术分享图片

 

 例如:

技术分享图片

 

 

map:

技术分享图片

 

 例如:

技术分享图片

 

前端基础之JavaScript

原文:https://www.cnblogs.com/SR-Program/p/11482112.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!