整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
了算術運算符和位運算符外，C語言還提供了一些其他類型的運算符，包括逗號運算符、條件運算符、sizeof運算符、指針運算符等。這些運算符在C語言中具有特定的功能和用途，對于編寫復雜的程序和實現各種算法非常有用。本文將深入介紹C語言中的這些其他運算符，幫助讀者更好地理解和掌握這一重要概念。
以下是我整理的關于C語言的一些入門級資料，免費分享給大家：https://m.hqyjai.net/emb_study_blue_short.html?xt=zxy
位編程愛好者，今天由小藍與大家分享13個基本的JavaScript 函數，如果您是 Web前端開發人員，您應該熟悉這些函數。
您可以將本文所有 JavaScript 函數加入收藏至您的工具箱，以便在您的軟件項目中盡可能使用這些片段。
1. 檢索任何 JavaScript 數組中的第一個/最后一個項目
通常，如果使用 JavaScript，我需要數組的第一個元素。為了可用性，我創建了一個簡單的 head 函數，我可以將其用于數組并將返回第一項。
作為獎勵，我添加了 JavaScript last 函數，它從數組中檢索最后一項。
const head=(arr)=> arr[0];
const last=(arr)=> arr[arr.length - 1];
head([1, 2, 3, 4, 5, 6, 7, 8]); // 1
last([1, 2, 3, 4, 5, 6, 7, 8]); // 82. JavaScript 中的逗號運算符
JavaScript 中的逗號運算符起初可能很復雜。
但是，實際上，這真的很容易！
例如，使用 [x,y] 總是返回正確的操作數。請參閱以下 JavaScript 片段以更好地理解：
console.log([1, 2, 3, 4][1]); // 2
console.log([1, 2, 3, 4][(1, 2)]); // 3
console.log([1, 2, 3, 4][2]); // 33. 將任何內容復制到剪貼板
在開發網站時，您有時希望將特定內容復制到剪貼板以提高可用性。
在 JavaScript 中，這可以通過直接使用文檔（舊方法）或使用導航器組件（新方法）來完成。
function copyToClipboard() {
const copyText=document.getElementById('myInput');
copyText.select();
document.execCommand('copy');
}
// new API
function copyToClipboard() {
navigator.clipboard.writeText(document.querySelector('#myInput').value);
}4. JavaScript 中的嵌套解構
解構是一個重要的 JavaScript 主題，之前也有詳細的分享過。
但是今天這個代碼片段顯示了簡單的對象重組，僅從對象中提取兩個變量。
const user={
id: 459,
name: 'Paul Knulst',
age: 29,
job: {
role: 'Tech Lead',
},
};
const {
name,
job: { role },
}=user;
console.log(name); // Paul Knulst
console.log(role); // Tech Lead5. 為任何對象添加全局可用的函數
在 JavaScript 中，可以使用新方法擴展任何對象。
以下 JavaScript 片段顯示了如何將 toUpperCase 函數添加到數組。
Array.prototype.toUpperCase=function () {
let i;
for (let i=0; i < this.length; i++) {
this[i]=this[i].toUpperCase();
}
return this;
};
const myArray=['paul', 'knulst', 'medium'];
console.log(myArray); // ['paul', 'knulst', 'medium']
console.log(myArray.toUpperCase()); // ['PAUL', 'KNULST', 'MEDIUM']這個概念稱為原型繼承，本文對此進行了詳細介紹。
6. 在 JavaScript 中將數組本地轉換為對象
JavaScript 有一個原生函數 Object.fromEntries，可用于將任何輸入數組轉換為對象。
const anArray=[
['firstname', 'Paul'],
['surname', 'Knulst'],
['address', 'worldwide'],
['role', 'Senior Engineer'],
['followers', 'not much'],
];
const anObj=Object.fromEntries(anArray);
console.log(anObj);
// {
// firstname: 'Paul',
// surname: 'Knulst',
// address: 'worldwide',
// role: 'Senior Engineer',
// followers: 'not much'
// }7. 遞歸得到一個數的斐波那契
遞歸是每個軟件開發者必須知道的概念！
此 JavaScript 片段顯示了以遞歸方式實現的斐波那契函數。
const getFibonacci=(n, memo={})=>
memo[n] ||
(n <=2
? 1
: (memo[n]=getFibonacci(n - 1, memo) + getFibonacci(n - 2, memo)));
console.log(getFibonacci(4)); // 3
console.log(getFibonacci(8)); // 218. 檢查約會對象是否在周末
這個 JavaScript 片段顯示了檢查每個 Date 對象是否為周末是多么容易。
您可以更改周數（6 和 0）并將其替換為任何其他工作日編號以檢查不同的日子。
const isWeekend=(date)=> date.getDay()===6 || date.getDay()===0;
console.log(isWeekend(new Date())); // false
console.log(isWeekend(new Date('2022-10-28'))); // false
console.log(isWeekend(new Date('2022-10-29'))); // true9. 將 24 小時制時間格式轉換為 am/pm
使用不同的時間格式是一件痛苦的事情。
這個簡單的 JavaScript 片段顯示了一個將任何 24 小時制時間轉換為上午/下午時間的函數。
const toAMPMFormat=(h)=>
`${h % 12===0 ? 12 : h % 12}${h < 12 ? ' am.' : ' pm.'}`;
console.log(toAMPMFormat(12)); // 12 pm.
console.log(toAMPMFormat(21)); // 9 pm.
console.log(toAMPMFormat(8)); // 8 am.
console.log(toAMPMFormat(16)); // 4 pm10. 檢查對象中是否存在屬性
有時你想在打印或使用它們之前檢查屬性是否存在。
JavaScript 沒有在使用它之前執行 if property !==undefined ，而是有一個內置函數來執行此操作。
const developer={
name: 'Paul Knulst',
role: 'Tech Lead',
extra: 'Loves DevOps',
company: 'Realcore',
os: 'Windows',
};
const laptop={
os: 'Windows',
buydate: '27.10.2022',
extra: 'looks cool',
};
console.log('name' in developer); // true
console.log('extra' in developer); // true
console.log('name' in laptop); // false
console.log('extra' in laptop); // true結合 nullish 合并運算符，它可以使您的 JavaScript 代碼更清晰！
11. 檢查數組是否包含相同的值
在某些情況下，您需要知道兩個數組是否包含相同的值。
此 JavaScript 代碼段包含一個函數 containSameValues，它通過排序和連接兩個數組并比較它們的字符串來執行此操作。
const containSameValues=(arr1, arr2)=>
arr1.sort().join(',')===arr2.sort().join(',');
console.log(containSameValues([1, 2, 3], [1, 2, 3])); // true
console.log(containSameValues([1, 2, 3], [2, 3, 4])); // false
console.log(containSameValues([1, 2, 3], [1, 2, 3, 4])); // false請記住，數組必須是可排序的才能真正正確地比較它們！
12.確保變量在指定范圍內
這個 JavaScript 函數對我來說非常有用！
它檢查變量是否在特定范圍內，如果不在范圍內，它將把它限制在最接近的最小值或最大值。
const clamp=(min, max, value)=> {
if (min > max) {
throw new Error('min cannot be greater than max');
}
return value < min ? min : value > max ? max : value;
};
clamp(0, 6, -5); // 0
clamp(0, 6, 20); // 6
clamp(0, 6, 3); // 313、在一行中交換兩個變量
這不是 JavaScript 函數，但它是交換兩個變量的一種非?？岬姆椒ā?/span>
它展示了如何在一行中完成，而不是將值放入“臨時”對象（必須在其他一些編程語言中完成）
let x=50;
let y=100;
console.log(x, y); //50 100
[y, x]=[x, y];
console.log(x, y); //100 50結束語
以上就是今天所分享的內容，如果您在學習或者工作中有很好的 JavaScript 片段，可以評論，一起共同學習。
CSS的代碼是類似 json 數據的鍵值對，也就是key : value，當然，每一句都必須以分號（；）結束，切記，沒有分號會出問題的。
其實類似 json 數據在我們生活中很常見，比如以下例子：
姓名：小明
性別：男
班別：19計機預師班
在以上例子中，“姓名”可以稱為字段或者屬性，姑且叫它“屬性”吧，而后面的“小明”則是屬性值，這樣子就形成了一種明確的數據組，同樣道理，先看一下CSS代碼：
background-color：red;
color:green;
font-size:2em;
......發現沒有？其實這兩種方式是差不多一樣的，“background-color”是屬性（property），而它的值（value）則是“red”，用這種方式，就設定了背景顏色為紅色。只不過CSS代碼后面必須要加分號（;）結束，在這里再次提醒。
當然，還有一點要提醒初學者，在計算機程序設計中，所有的標點符號的輸入必須切換到英文輸入的狀態，不然，也會出現一些莫名其妙錯誤出來。
好了，上面介紹了CSS代碼長啥樣，那么接下來就要明確一個問題：代碼寫出來后，我們怎么應用到HTML中去？也就是說，怎么用CSS控制HTML的顯示效果。
在具體的應用中，我們引入“選擇器（selector）”這個概念。
什么是選擇器（selector）？其實按照我們的理解，你寫好了CSS代碼以后，那你要把這些寫好的代碼應用到某個地方去對吧，而這些受體就是選擇器。
CSS有三種選擇器，分別是標簽（tag）、類（class）和ID.
標簽，指的是HTML標簽，也就是說，所有的HTML標簽都是標簽選擇器。要注意的是，如果要用標簽選擇器，必須是HTML標簽，不允許自定義。先看以下例子(大家可以把以下代碼保存為html文件，然后用瀏覽器打開看效果）：
<html>
<head>
<style>
p{
background-color:red;
color:green; font-size:2em;
}
</style>
</head>
<body>
<p>注意這里顯示的顏色</p>
<p>再留意顯示這里的顏色</p>
<b>好吧，再次留意這里的顏色</b>
</body>
</html>以上代碼中，第4~8行是標簽選擇器的應用方式，格式很簡單，就是直接寫HTML標簽（上面的例子中用了p標簽），然后后面跟著一對大括號（{}），大括號里面寫具體的CSS代碼，以上案例的功能就是，給HTML中所有的p標簽內容（第12~13行）應用上“紅色背景、綠色字和2em的字體大小”的效果，而第14行中是b標簽，沒有該效果。
我們有這么一個場景：在以下代碼中，我們給p標簽加上了綠色的字體顏色，也就是說第12~13行的文字是綠色的，那如果我需要給“注意這里顯示的顏色”和“再留意顯示這里的顏色”這兩行文本添加不同的顏色，怎么辦呢？
<html>
<head>
<style>
p{
background-color:red;
color:green;
font-size:2em;
}
</style>
</head>
<body>
<p>注意這里顯示的顏色</p>
<p>再留意顯示這里的顏色</p>
<b>好吧，再次留意這里的顏色</b>
</body>
</html>有兩種方法，分別是類和ID可以解決。
先用類的方法：我們可以手動地在兩個p標簽中都加上類，或者為其中一個加上即可。具體做法如下。
<html>
<head>
<style>
p{
background-color:red;
color:green;
font-size:2em;
}
.yellow{
color:yellow;
}
</style>
</head>
<body>
<p class="yellow">注意這里顯示的顏色</p>
<p>再留意顯示這里的顏色</p>
<b>好吧，再次留意這里的顏色</b>
</body>
</html>在以上代碼中，我在第15行的p標簽內加了一個class屬性，屬性值為“yellow”，然后第9~11行則是對yellow類的具體實現，像這樣就可以給“注意這里顯示的顏色”這行文本加了黃色（yellow）的效果了。
總結一下類的語法：.<類名>{<具體的CSS代碼>}。
注意：類名是自定義的，你喜歡用什么類名就什么類名，但是，你所起的類名也要符合一些規則：一是必須以字母或者下劃線（_）作為開頭，后面可以加數字，不能加其他符號；二是類名是對大小寫敏感的，也就是說一個字母的大寫和小寫狀態是兩個不一樣的類名。
好了，接下來是另外一種實現方法，用ID.
ID方法的實現在形式上跟類（class）差不多，在CSS選擇器中，類的語法是，在類名前面加一個點（.），而ID的不一樣的地方在于，它在ID名前面加的是一個#號，具體做法如下：
<html>
<head>
<style>
p{
background-color:red;
color:green;
font-size:2em;
}
#yellow{
color:yellow;
}
</style>
</head>
<body>
<p id="yellow">注意這里顯示的顏色</p>
<p>再留意顯示這里的顏色</p>
<b>好吧，再次留意這里的顏色</b>
</body>
</html>以上案例中，通過ID的方法，也可以把“注意這里顯示的顏色”文本修改成黃色（yellow）顯示效果。
大家可以對比類和ID的實現方法，兩者只是在符號和引用方式上存在不一樣，那真的只是在形式上不一樣嗎？
并不是這樣的，之所以存在這兩種方式，因為這兩者它們有各自的特性。
類的特性：類的最大特征是可復用，可以在多個不同的標簽中應用同一個類。比如以下這個案例：
<html>
<head>
<style>
p{
background-color:red;
color:green;
font-size:2em;
}
.yellow{
color:yellow;
}
</style>
</head>
<body>
<p class="yellow">注意這里顯示的顏色</p>
<p>再留意顯示這里的顏色</p>
<b class="yellow">好吧，再次留意這里的顏色</b>
</body>
</html>在以上代碼中，我定義了一個yellow類（第9~11行），然后分別應用到“注意這里顯示的顏色”（第15行）和“好吧，再次留意這里的顏色”（第17行）文本上。
ID的特性：ID，顧名思義，就是身份標識，身份標識具有唯一性，而ID的作用，就是標識唯一性，也就是說，只要在某個標簽上應用一個ID，那就不能再在其他標簽上使用該ID了。
至于這三種選擇器的優先級，這里直接說結論，ID優先級最高，類其次，標簽優先級最低。大家可以運行以下代碼看結果：
<html>
<head>
<style>
p{
color: brown;
}
.cl{
color: black;
}
#ii{
color: green;
}
</style>
</head>
<body>
<p class="cl">注意這里顯示的顏色</p> <!-- 顯示顏色為black -->
<p class="cl" id="ii">再留意這里顯示的顏色</p> <!-- 顯示顏色為green -->
</body>
</html>符號選擇器，嚴格來講，不能稱之為“選擇器”，它指的是在使用選擇器的時候，用上一些符號，使得選擇器的功能更加豐富。在這里介紹三個。
1.星號（*）：星號代表“包含所有”的意思，比如：
2.空格：空格在這里有限定作用。
比如以下例子，我現在有這么一個需求，我需要把基礎科目中的三個科目（語文、數學、英語）設置為藍色顯示，并加粗；而專業科目中兩個科目（計算機和幼兒教育）文本設置成綠色，并加粗，那怎么處理呢？
<html>
<head>
<style>
</style>
</head>
<body>
<ul>
<p>基礎科目：</p>
<li>語文</li>
<li>數學</li>
<li>英語</li>
</ul>
<ul>
<p>專業科目</p>
<li>計算機</li>
<li>幼兒教育</li>
</ul>
</body>
</html>假如我對“li”標簽設置CSS，那所有的“li”標簽都是同一個樣式，那就沒有基礎科目和專業科目的區別了。在這里，我可以這樣解決：
解決方法如下代碼：
<html>
<head>
<style>
.ul1 li{
color: blue;
font-weight: bold;
}
.ul2 li{
color: green;
font-weight: bold;
}
</style>
</head>
<body>
<ul class="ul1">
<p>基礎科目：</p>
<li>語文</li>
<li>數學</li>
<li>英語</li>
</ul>
<ul class="ul2">
<p>專業科目</p>
<li>計算機</li>
<li>幼兒教育</li>
</ul>
</body>
</html>特別說明：在HTML標簽中，每個標簽都稱為“節點（node）”，每個節點隨著HTML標簽的包含關系，存在著相對的父子節點之分，包含元素的稱為父節點，被包含元素被稱為子節點。在以上代碼中，ul和li的關系，ul是父節點，li是子節點。
3.逗號：對多個選擇器應用同樣的CSS樣式。
在對多個選擇器，無論是標簽選擇器、類選擇器還是ID選擇器，如果把這些選擇器冠以同樣的CSS樣式，則可以用逗號分隔，把多個選擇器寫在一起，代碼如下：
<html>
<head>
<style>
p,b,.cl,#ii{
color: brown;
font-weight: bold;
}
</style>
</head>
<body>
<p>注意這里顯示的顏色</p>
<p>再留意顯示這里的顏色</p>
<b>好吧，再次留意這里的顏色</b>
<div class="cl">用類的方式標識選擇器</div>
<p id="ii">用ID的方式標識選擇器</p>
</body>
</html>在以上代碼的第4~7行中，用逗號把p、b、.cl以及#ii這四個選擇器都應用上了同樣的CSS樣式。
VS Code一些常用快捷鍵
CTRL+？：添加注釋
CTRL+Enter：強制換行，無論光標在不在末端。
好了，當你看到這里，你對CSS是什么應該有詳盡的了解了，那就開始先相關技術文檔自學吧！
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
