包含如何使用javascript时的词条

发布时间：2022-11-20

本文目录一览：

  1. javascript如何使用
  2. js如何使用？
  3. js怎么用
  4. Web前端新手应该知道的JavaScript开发技巧有哪些?

javascript如何使用

1、字符串的创建

创建一个字符串有几种方法。最简单的是用引号将一组字符包含起来，可以将其赋值给一个字符串变量。

var myStr = "Hello, String!";

我们在上面脚本创建了字符串，但本质上，它们并不是真正的字符串对象，准确地说，它们是字符串类型的值。要创建一个字符串对象，可使用如下语句：

var strObj = new String("Hello, String!");

使用 typeof 运算符查看会发现，上面的 myStr 类型为 string，而 strObj 类型为 object。 如果想知道字符串的长度，使用其 length 属性：string.length。 得到字符串的指定位置的字符使用方法：string.charAt(index);

2、字符串的拼接

非常简单，就用一个 + 将两个字符串"相加"：

var longString = "One piece " + "plus one more piece.";

要将多个字符串累积为一个字符串，还可以使用 += 操作符：

var result = "";
result += "My name is Anders"
result += " and my age is 25";

要在字符串中添加换行符，需要使用转义字符 \n：

var confirmString = "You did not enter a response to the last " +
"question.\n\nSubmit form anyway?";
var confirmValue = confirm(confirmString);

但这种方法只能用在像警告、确认对话框之类的情况下，如果将这段文本作为HTML内容呈现，就无效了，此时用 <br> 代替它：

var htmlString = "First line of string.<br>Second line of string.";
document.write(htmlString);

String对象还提供了方法 concat()，它完成与 + 相同的功能：

string.concat(value1, value2, ...)

不过 concat() 方法显然不如 + 来得直观简洁。

3、访问字符串的子串

使用 substring() 或 slice() 方法（NN4+, IE4+），下面说明它们的具体用法。 substring() 的原型为：

string.substring(from, to)

第一个参数 from 指定了子字符串在原字符串中的起始位置（基于0的索引）；第二个参数 to 是可选的，它指定了子字符串在原字符串的结束位置（基于0的索引），一般情况下，它应比 from 大，如果它被省略，那么子字符串将一直到原字符串的结尾处。 如果参数 from 不小心比参数 to 大了会怎样？JavaScript会自动调解子字符串的起止位置，也就是说，substring() 总是从两个参数中较小的那个开始，到较大的那个结束。不过要注意，它包含起始位置的那个字符，但不包含结束位置的那个字符。

var fullString = "Every dog has his day.";
var section = fullString.substring(0, 4); // section is "Ever".

slice() 的原型为：

string.slice(start, end)

参数 start 表示子串的起始位置，如果为负数，那么可以理解为倒数第几个开始，例如 -3 表示从倒数第三个开始；参数 end 表示结束位置，与 start 一样，它也可以为负数，其含义也表示到倒数第几个结束。slice() 的参数可以为负数，所以要比 substring() 更加灵活，但没那么宽容了，如果 start 比 end 要大，它将返回一个空字符串（示例略）。 还有一个方法是 substr()，其原型为：

string.substr(start, length)

从原型可以看出它的参数的含义，start 表示起始位置，length 则表示子字符串的长度。JavaScript标准不提倡使用该方法。

4、字符串的大小写转换

使用 toLowerCase() 和 toUpperCase() 方法：

var city = "ShanGHai";
city = city.toLowerCase(); // city is "shanghai" now.

5、判断两个字符串是否相等

先将用户的输入值全部转换为大写（或小写），然后再行比较：

var name = document.form1.txtUserName.value.toLowerCase();
if(name == "urname")
{
    // statements go here.
}

JavaScript有两种相等运算符。一种是完全向后兼容的，标准的 ==，如果两个操作数类型不一致，它会在某些时候自动对操作数进行类型转换，考虑下面的赋值语句：

var strA = "i love you!";
var strB = new String("i love you!");

这两个变量含有相同的字符序列，但数据类型却不同，前者为 string，后者为 object，在使用 == 操作符时，JavaScript会尝试各种求值，以检测两者是否会在某种情况下相等。所以下面的表达式结果为 true：strA == strB。 第二种操作符是"严格"的 ===，它在求值时不会这么宽容，不会进行类型转换。所以表达式 strA === strB 的值为 false，虽然两个变量持有的值相同。 有时代码的逻辑要求你判断两个值是否不相等，这里也有两个选择：!= 和严格的 !==，它们的关系就类似于 == 和 ===。 讨论： == 和 != 在求值时会尽可能地寻找值的匹配性，但你可能还是想在比较前进行显式的类型转换，以"帮助"它们完成工作。比如，如果想判断一个用户的输入值（字符串）是否等于一个数字，你可以让 == 帮你完成类型转换：

if(document.form1.txtAge.value == someNumericVar) { ... }

也可以提前转换：

if(parseInt(document.form1.txtAge.value) == someNumericVar) { ... }

如果你比较习惯于强类型的编程语言（比如C#, Java等），那么这里你可以延续你的习惯（类型转换），这样也会增强程序的可读性。 有一种情况需要注意，就是计算机的区域设置。如果用 "" 和 "" 来比较字符串，那么JavaScript把它们作为Unicode来比较，但显然，人们在浏览网页时不会把文本当作Unicode来阅读。比如在西班牙语中，按照传统的排序，"ch" 将作为一个字符排在 "c" 和 "d" 之间。localeCompare() 提供了一种方式，可以帮助你使用默认区域设置下的字符排序规则。

var strings; // 要排序的字符串数组，假设已经得到初始化
strings.sort(function(a,b) { return a.localeCompare(b) }); // 调用sort()方法进行排序

6、字符串的查找

使用 string 的 indexOf() 方法：

strObj.indexOf(subString[, startIndex])

strObj 为要进行判断的字符串，subString 为要在 strObj 查找的子字符串，startIndex 是可选的，表示查找的开始位置（基于0的索引），如果 startIndex 省略，则从 strObj 开始处查找，如果 startIndex 小于0，则从0开始，如果 startIndex 大于最大索引，则从最大索引处开始。 indexOf() 返回 strObj 中 subString 的开始位置，如果没有找到，则返回 -1。在脚本中，可以这么使用：

if(largeString.indexOf(shortString) != -1)
{
    // 如果包含，进行相应处理；
}

也许一个字符串会包含另一字符串不止一次，这时第二个参数 startIndex 也许会派上用场，下面这个函数演示如何求得一个字符串包含另外一个字符串的次数：

function countInstances(mainStr, subStr)
{
    var count = 0;
    var offset = 0;
    do
    {
        offset = mainStr.indexOf(subStr, offset);
        if(offset != -1)
        {
            count++;
            offset += subStr.length;
        }
    }while(offset != -1)
    return count;
}

String对象有一个与 indexOf() 对应的方法，lastIndexOf()：

strObj.lastIndexOf(substring[, startindex])

strObj 为要进行判断的字符串，subString 为要在 strObj 查找的子字符串，startIndex 是可选的，表示查找的开始位置（基于0的索引），如果 startIndex 省略，则从 strObj 末尾处查找，如果 startIndex 小于0，则从0开始，如果 startIndex 大于最大索引，则从最大索引处开始。该方法自右向左查找，返回 subString 在 strObj 中最后出现的位置，如果没有找到，返回 -1。

js如何使用？

  1. 在HTML里面加入JavaScript；方法非常简单，就是通过一对 <script></script> 标签，然后在标签里面书写代码即可；
  2. 标签位置；按照以前传统的方法，我们的 <script> 标签都是放在 <head> 标签里面的。但是由于浏览器进行渲染的时候是由上往下进行渲染，这样会导致浏览器在呈现页面的时候出现延迟。延迟的时候就是空白，影响用户体验。所以现在的方法，都是将 <script> 标签写在 <body> 里面，元素的后面。
  3. 外部JS文件；
    • 可维护性高；
    • 可缓存：例如有两个HTML文件（A，B）都是用的同一个JS文件。当用户请求A页面的时候，A页面的HTML文件和JS文件一起被下载到本地。接下来用户再请求B页面的时候，只需要下载B页面的HTML页面即可，因为JS文件已经有了。
  4. JavaScript语法；
    • JavaScript区分大小写，test 和 Test 表示不同变量；
    • 标识符；JavaScript里面的标识符由数字、字母、下划线（_）和 $ 组成，不能以数字开头；
    • 注释：JavaScript注释有两种：多行注释和单行注释。

js怎么用

来看看js代码的用法。 我们在使用JavaScript代码有两种写法：一种是在HTML页面中直接嵌入js代码，另一种是通过链接外部的JavaScript文件。 我们先来看第一种用法：在HTML页面中直接嵌入js代码。 如果在HTML页面中直接嵌入JavaScript代码，我们需要使用 <script> 标签，<script> 和 </script> 会告诉 JavaScript 在何处开始和结束。 <script> 和 </script> 之间的代码行包含了 JavaScript：

<script>
alert("My First JavaScript");
</script>

在HTML页面的任何位置（head部分、body部分、body的后面，较好）都可以插入 <script> 标签。 你有可能会在 <script> 标签中看到使用 type="text/javascript"，但是现在已经不必这样做了。JavaScript现在已经是所有现代浏览器以及 HTML5 中的默认脚本语言。 我们来看一个具体的示例：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
</script>
</body>
</html>

上述代码就是在HTML页面中直接嵌入js代码。 接着我们来看看js代码的第二种用法：通过链接外部的JavaScript文件。 有时JavaScript代码过多的话，我们可以将代码单独放在JavaScript文件中然后链接起来。 我们链接外部JavaScript文件可以有以下步骤：

  1. 首先我们建立一个JavaScript文件，扩展名是 .js；
  2. 然后将要编写的js代码写到Js文件中，并保存文件；
  3. 使用 <script> 标签将JavaScript文件链接到HTML文件中：
<script type="text/javascript" src="JavaScript文件名和路径"></script>

需要注意一点的是，在一个已经引入外部js文件的 <script> 标签中，不能在它的开始标签和结束标签中写Js命令了。 我们来看一个具体的示例： 我们先建一个js文件 sample.js，然后写入js代码：

document.write("<p>This is a paragraph</p>");

最后使用 <script> 标签将JavaScript文件链接到HTML文件中：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script type="text/javascript" src="sample.js"></script>
</body>
</html>

以上就是js代码使用的两种方法。

Web前端新手应该知道的JavaScript开发技巧有哪些?

今天小编要跟大家分享的文章是关于Web前端新手应该知道的JavaScript开发技巧有哪些？熟悉Web前端的小伙伴都知道，JavaScript的很多扩展的特性是使得它变得更加的犀利，同时也给予程序员机会创建更漂亮并且更让用户喜欢的网站。 尽管很多的开发人员都乐于颂扬javascript，但是仍旧有人看到它的阴暗面。 使用很多javascript代码的Web页面会加载很慢，过多的使用javascript使得网页丑陋和拖沓。很快如何有效地使用javascript成为一个非常火热的话题。 今天小编就为Web前端新手准备了这篇JavaScript开发技巧，希望能够对你有所帮助，下面我们一起来看一看吧！

1、尽可能的保持代码简洁

可能大家都听到过了N遍这个代码简洁问题了。作为一个开发人员你可能在你的代码开发过程中使用了很多次，但千万不要在js开发中忘记这点。

  • 尽量在开发模式中添加注释和空格，这样保持代码的可读性；
  • 在发布到产品环境前请将空格和注释都删除，并且尽量缩写变量和方法名；
  • 使用第三方工具帮助你实现压缩javascript。

2、思考后再修改prototypes

添加新的属性到对象prototype中是导致脚本出错的常见原因。

yourObject.prototype.anotherFunction='Hello';
yourObject.prototype.anotherMethod=function(){...}

在上面代码中，所有的变量都会被影响，因为他们都继承于 yourObject。这样的使用会导致意想不到的行为。所以建议在使用完后删除类似的修改。

yourObject.prototype.anotherFunction='Hello';
yourObject.prototype.anotherMethod=function(){};
test.anotherMethod();
delete yourObject.prototype.anotherFunction='Hello';
delete yourObject.prototype.anotherMethod=function(){};

3、DebugJavascript代码

即使最好的开发人员都会犯错。为了最大化的减少类似错误，请在你的debugger中运行你的代码，确认你没有遇到任何细微的错误。

4、避免Eval

你的JS在没有eval方法的时候也可以很好的工作。eval允许访问javascript编译器。如果一个字符串作为参数传递到eval，那么它的结果可以被执行。 这会很大的降低代码的性能。尽量避免在产品环境中使用eval。

5、最小化DOM访问

DOM是最复杂的API，会使得代码执行过程变慢。有时候Web页面可能没有加载或者加载不完整。最好避免DOM。

6、在使用javascript类库之前先学习javascript

互联网充斥着很多的javascript类库，很多程序员都往往使用js类库而不理解负面影响。强烈建议你在使用第三方类库之前学习基本的JS代码，否则，你就准备着倒霉吧。

7、不要用“SetTimeOut”和“Setinterval”方法来作为“Eval”的备选

setTimeOut("document.getID('value')",3000);

在以上代码中 document.getID('value') 在 setTimeOut 方法中被作为字符串来处理。这类似于 eval 方法，在每个代码执行中来执行一个字符串，因此会降低性能，因此，建议在这些方法中传递一个方法。

setTimeOut(yourFunction,3000);

8、[]比newArray();更好

一个常犯的错误在于使用当需要数组的时候使用一个对象或者该使用对象的时候使用一个数组。但是使用原则很简单：

“当属性名称是小的连续整数，你应该使用数组。否则，使用一个对象” —— Douglas Crockford，《JavaScript: Good Parts》的作者。 建议：

var a=['1A','2B'];

避免：

var a=new Array();
a[0]="1A";
a[1]="2B";

9、尽量不要多次使用var

在初始每一个变量的时候，程序员都习惯使用 var 关键字。相反，建议你使用逗号来避免多余的关键字，并且减少代码体积。如下：

var variableOne='string1',
    variableTwo='string2',
    variableThree='string3';

10、不要忽略分号“;”

这往往是大家花费数个小时进行debug的原因之一。 我很确信你肯定也在其它的文章中阅读过以上相关的内容，但是大家可能往往都忽略了很多基本的规则。你是不是也曾经忽略过分号？是不是也遇到过 eval 关键字问题导致性能问题？ 以上就是小编今天为大家分享的关于Web前端新手应该知道的JavaScript开发技巧有哪些的文章，希望本篇文章能够对刚刚接触Web前端行业的新手们有所帮助。想要了解更多Web前端知识记得关注北大青鸟Web前端培训官网!

声明：内容与图片均来源于网络（部分内容有修改），版权归原作者所有，如来源信息有误或侵犯权益，请联系我们删除或授权事宜。

推荐文章